Using the JQ plugin DataTable in ASP.

1. Models

 Public class Citys    {        publicintgetset;}          Public string Get Set ; }          Public int Get Set ; }    }

2. Controller

  Public classHomecontroller:controller { PublicActionResult Index () {returnView (); }         PublicActionResult Getjsoncitys (int?Secho) {            varCityList =NewList<citys>();  for(inti =0; I < -; i++) {Citylist.add (NewCitys {Id=I, CityName=Guid.NewGuid (). ToString (), ZipCode=DateTime.Now.Millisecond}); }            varOBJS =Newlist<Object>(); foreach(varCityinchcitylist) {Objs. ADD (getpropertylist).            ToArray ()); }            returnJson (New{Secho=Secho, Itotalrecords=Citylist.count (), Aadata=Objs}, Jsonrequestbehavior.allowget); }        Privatelist<string> Getpropertylist (Objectobj) {            varPropertyList =Newlist<string>(); varProperties = obj. GetType (). GetProperties (BindingFlags.Instance |bindingflags.public); foreach(varPropertyinchproperties) {                ObjectO = property. GetValue (obj,NULL); Propertylist.add (o==NULL?"": O.tostring ()); }            returnpropertylist; }    }

3. Views

@{Layout=NULL;}<! DOCTYPE html>"@Url. Content ("~/style/demo_page.css")"Rel="stylesheet"Type="Text/css"/> <link href="@Url. Content ("~/style/jquery-ui-1.8.4. custom.css")"Rel="stylesheet"Type="Text/css"/> <link href="@Url. Content ("~/style/demo_table_jui.css")"Rel="stylesheet"Type="Text/css"/> <script src="@Url. Content ("~/scripts/jquery-1.4.4. min.js")"Type="Text/javascript"></script> <script src="@Url. Content ("~/scripts/plug-inch/jquery.datatables.js")"Type="Text/javascript"></script> <script type="Text/javascript"charset="Utf-8">$ (document). Ready (function () {$ ('#DataTable'). dataTable ({"Olanguage": {//language Internationalization                    "sURL":"/scripts/plug-in/jquery.datatable.cn.txt"                },                "Bjqueryui":true,                "Spaginationtype":"full_numbers",                'bpaginate':true,//whether pagination is paginated.                 "bprocessing":true,//whether the message is being processed when the DataTable gets the data.                 "Bserverside":false,                "Sajaxsource":"Home/getjsoncitys",                "Aocolumns": [                                { "Stitle":"numbering","Sclass":"Center" },                                { "Stitle":"City Name","Sclass":"Center" },                                { "Stitle":"Postal Code","Sclass":"Center" },                                {                                    "Stitle":"Operation",                                    "Sclass":"Center",                                    "Fnrender": function (obj) {return '<a href=\ "details/'+ obj.adata[0] +'\ "> View details </a> <input tag=\"'+ obj.adata[0] +'\ "type=\" checkbox\ "name=\" name\ "/>';        }                                }                             ]            });        }); //The aocolumns parameter is used to define the column of the table, an array in which each object is used to define a column. //for each Column object: Stitle defines the column's title Sclass defines the style of the column//The fnrender function is used to render the column, and the function passes a parameter object whose Idatacolumn property represents the current column index, AData represents the current row array.         The result returned by the function is populated in the cell. //of course, the length should be the same for arrays that represent rows.  If a row of data is missing or provides too much data, a warning is given. </script>"font-size:12px;"> <tableclass="Display"Id="DataTable"> <thead> <tr> <th>Id</th> <th>CityName</th> <th>ZipCode</th> <th>Operation</th> </tr> </thead> <tbody> </tbody> </table></ Body>

Example Download:
http://down.51cto.com/data/892223
Using the JQ plugin DataTable in ASP.