Displaying a Paged Grid of Data in ASP.NET MVC

<p> This article demonstrates how to display a paged grid of data in an <a MVC</a> application and builds upon the work done in two earlier articles: <a a Grid of Data in ASP.NET MVC</a> and <a a Grid of Data in ASP.NET MVC</a>. <i>Displaying a Grid of Data in ASP.NET MVC</i> started with creating a new ASP.NET MVC application in Visual Studio, then added the Northwind database to the project and showed how to use Linq-to-SQL tool to access data from the database. The article then looked at creating a Controller and View for displaying a list of product information (the Model). </p><p><i>Sorting a Grid of Data in ASP.NET MVC</i> enhanced the application by adding a view-specific Model (<code>ProductGridModel</code>) that provided the View with the sorted collection of products to display along with sort-related information, such as the name of the database column the products were sorted by and whether the products were sorted in ascending or descending order. The <i>Sorting a Grid of Data in ASP.NET MVC</i> article also walked through creating a <i>partial view</i> to render the header row so that each column header was a link that, when clicked, sorted the grid by that column. </p><p> In this article we enhance the view-specific Model (<code>ProductGridModel</code>) to include paging-related information to include the current page being viewed, how many records to show per page, and how many total records are being paged through. Next, we create an action in the Controller that efficiently retrieves the appropriate subset of records to display and then complete the exercise by building a View that displays the subset of records and includes a paging interface that allows the user to step to the next or previous page, or to jump to a particular page number, we create and use a partial view that displays a numeric paging interface </p><p> Like with its predecessors, this article offers step-by-step instructions and includes a complete, working demo available for download at the end of the article. Read on to learn more! <br /><a More &gt;</a></p>

Read More...

---