Skip to main content
Home  › ... Razor

Data List-Details

Tutorial HomeList-Details
Requirements
Resources

List Details using Automatic View-Switching

The previous examples showed you how to do things "manually". In this example, the 2sxc-view configuration says that the main view should come when id is in the url, and that the details view should come, when id  (for details) is in the url. This automatic view switching makes life easier and code shorter:).

@inherits Custom.Hybrid.Razor14

<h4>List of main view</h4>
<ul>
  @foreach (var person in AsList(App.Data["Persons"])) {
    <li>
      <a href='@Link.To(parameters: CmsContext.Page.Parameters.Set("id", person.EntityId))'>
        @person.FirstName @person.LastName
      </a>
    </li>
  }
</ul>

Source Code of Snip-Basic-Details.Dyn.cshtml

@inherits Custom.Hybrid.Razor14

<h4>Details View (automically activated)</h4>
<p>
  You now see the details page. It was automatically shown, because the url contains <code>id</code>.
  The image to the right shows where this configuration applied. 
</p>
@{
  var urlParams = CmsContext.Page.Parameters;
  var urlId = urlParams["id"];
  int id = Int32.Parse(urlId);

  // find the person with this Id using LINQ
  var person = AsList(App.Data["Persons"])
    .First(p => p.EntityId == id);
}

<img loading="lazy" src="@person.Mugshot?w=50&h=50&mode=crop" width="50px" style="border-radius: 50%" class="float-left">
<h3>Details of @person.FirstName @person.LastName</h3>
<a href='@Link.To(parameters: urlParams.Remove("Id"))'>back to list</a>

View-Switching based on URL Parameters

This requires the view configuration to be set to activate the details view if id is specified in the url, using id/.*