MVC: Custom sorting for HTML table

Hi,

I was wondering how I can sort a HTML table the smartest way. I've got
the following table:

<table id="customersTable" class="dataTable">
<thead>
<tr>
<th>Kundenavn</th>
<th>POB kunde nr.</th>
<th>SAP kontrakt nr.</th>
<th>Start dato</th>
<th>Brugere</th>
</tr>
</thead>
<tbody>
<% foreach (var c in ViewData["Customers"] as List<Customer>)
{ %>
<tr>
<td><%= Html.ActionLink(c.Name, c.ID.ToString(),
"Customers") %></td>
<td class="alignRight"><%= c.POBNo %></td>
<td class="alignRight"><%= c.SAPContractNo %></td>
<td class="alignRight"><%=
c.StartDate.ToString("dd-MM-yy") %></td>
<td class="alignRight"><%= c.Users.Count %></td>
</tr>
<% } %>
</tbody>
</table>

Where each header cell should be clickable to sort the choosen column.

The table datasource is a List<Customer>, published using LINQ to SQL.
Heres the controller:

AdvoforumDataContext advoforum = new AdvoforumDataContext();
List<Customercustomers = advoforum.GetCustomers();
ViewData["Customers"] = customers;
return View();

Could you give me a hint how to do this the "best" way?

you have two options. sort client side using javascript (which is how i'd do
it), or add an anchor on the column heads and sort server side:

<th><a href="list/sort/1">Kundenavn</a></th>
<th><a href="list/sort/2">POB kunde nr.</a></th>

where you add a sort method to the list controller.

-- bruce (sqlwork.com)

"Tommy Holm Jakobsen" wrote:

Quote:

Hi,
>
I was wondering how I can sort a HTML table the smartest way. I've got
the following table:
>
<table id="customersTable" class="dataTable">
<thead>
<tr>
<th>Kundenavn</th>
<th>POB kunde nr.</th>
<th>SAP kontrakt nr.</th>
<th>Start dato</th>
<th>Brugere</th>
</tr>
</thead>
<tbody>
<% foreach (var c in ViewData["Customers"] as List<Customer>)
{ %>
<tr>
<td><%= Html.ActionLink(c.Name, c.ID.ToString(),
"Customers") %></td>
<td class="alignRight"><%= c.POBNo %></td>
<td class="alignRight"><%= c.SAPContractNo %></td>
<td class="alignRight"><%=
c.StartDate.ToString("dd-MM-yy") %></td>
<td class="alignRight"><%= c.Users.Count %></td>
</tr>
<% } %>
</tbody>
</table>
>
Where each header cell should be clickable to sort the choosen column.
>
The table datasource is a List<Customer>, published using LINQ to SQL.
Heres the controller:
>
AdvoforumDataContext advoforum = new AdvoforumDataContext();
List<Customercustomers = advoforum.GetCustomers();
ViewData["Customers"] = customers;
return View();
>
Could you give me a hint how to do this the "best" way?
>

On Tue, 8 Jul 2008 09:02:10 -0700, bruce barker
<brucebarker@discussions.microsoft.comwrote:

Quote:

>you have two options. sort client side using javascript (which is how i'd do
>it), or add an anchor on the column heads and sort server side:
>
><th><a href="list/sort/1">Kundenavn</a></th>
><th><a href="list/sort/2">POB kunde nr.</a></th>
>
>where you add a sort method to the list controller.
>
>-- bruce (sqlwork.com)
>
>
>"Tommy Holm Jakobsen" wrote:
>

Quote:

>Hi,
>>
>I was wondering how I can sort a HTML table the smartest way. I've got
>the following table:
>>
><table id="customersTable" class="dataTable">
> <thead>
> <tr>
> <th>Kundenavn</th>
> <th>POB kunde nr.</th>
> <th>SAP kontrakt nr.</th>
> <th>Start dato</th>
> <th>Brugere</th>
> </tr>
> </thead>
> <tbody>
> <% foreach (var c in ViewData["Customers"] as List<Customer>)
>{ %>
> <tr>
> <td><%= Html.ActionLink(c.Name, c.ID.ToString(),
>"Customers") %></td>
> <td class="alignRight"><%= c.POBNo %></td>
> <td class="alignRight"><%= c.SAPContractNo %></td>
> <td class="alignRight"><%=
>c.StartDate.ToString("dd-MM-yy") %></td>
> <td class="alignRight"><%= c.Users.Count %></td>
> </tr>
> <% } %>
> </tbody>
></table>
>>
>Where each header cell should be clickable to sort the choosen column.
>>
>The table datasource is a List<Customer>, published using LINQ to SQL.
>Heres the controller:
>>
>AdvoforumDataContext advoforum = new AdvoforumDataContext();
>List<Customercustomers = advoforum.GetCustomers();
>ViewData["Customers"] = customers;
>return View();
>>
>Could you give me a hint how to do this the "best" way?
>>

Thank you. I've found a way to do it client side using Javascript.

- Tommy

Hey there! Do you need ASP.NET help?

MVC: Custom sorting for HTML table

re: MVC: Custom sorting for HTML table

re: MVC: Custom sorting for HTML table

Similar ASP.NET bytes

/bytes/development

/bytes/it

/bytes/other

/bytes/about