How to add sort function for the table via ajax in ASP.NET MVC?What is the best practice.

Question

How to add sort function for the table via ajax in ASP.NET MVC?What is the best practice.

If not use Ajax, it maybe much easier, just return View, but if use AJAX, what data structure should return?I just use Json to return the data, but i found each JSON data model return to the client browser, the JS have to use different code to parse it, remove the originally table rows, add the new data rows(because the column is different) etc. It make me crazy, is there any better way to do that?

Thank you for any advice.

Answer 1

The way I would approach this in ASP.NET MVC would be to create a user control and place it into a page. Then you'll use the JQuery .load() AJAX function to call the path of the user control action. In this case the user control is in the Grid controller under the action named Sort. "Name" is the field to sort and "direction" is the direction the sort will go in. Of course you could parameterize this more so that direction switches between desc and ascending.

<div id="gridControl">
<table id="tblGrid">
<tr>
 <td><label onclick="$('#gridControl').load('/grid/Sort/Name?direction=desc #tblGrid')">Name</label>
</tr>
<% foreach(Item i in Model.Items) { %>
<tr>
 <td><%: i.Name %></td>

<tr>

<% } %>
</table>
</div>