Create a View template (Master page) in the following shared version
<! DOCTYPE html>
Index view
@using app.admin; @using app.common;@{ viewbag.title = "Index"; Layout = "~/views/shared/_index_layout.cshtml"; }
<table id= "List" ></table><script type= "Text/javascript" > $ (Function () {$ (' #List '). DataGrid ({ URL: '/syssample/getlist ', Width: $ (window). Width ()-Ten, Methord: ' Post ', he Ight: $ (window). Height () -35, Fitcolumns:true, sortname: ' Id ', SortOrder: ' Desc ', IDfield: ' Id ', striped:true,//odd-even row whether to distinguish between singleselect:true,//radio mode rownumbers:true,/ /Line number columns: [[{field: ' id ', title: ' Id ', width:80}, {field: ' Name ', title: ' Name ', width:120}, {field: ' Age ', Title: ' Ages ', width:80, align: ' right '}, {field: ' Bir ' , title: ' Birthday ', width:80, align: ' right '}, {field: ' Photo ', title: ' Photos ', width:250}, {F Ield: ' Note ', Title: ' Description ', width:60, align: ' center '}, {field: ' Createtime ', title: ' Creation Time ', width:60, a Lign: ' Center '} ]] }); });</script>
Add the GetList method to the Ajax use of the view in Syssamplecontroller
[HttpPost]
Public Jsonresult GetList ()
{
list<syssamplemodel> list = M_bll. GetList ("");
var json = new
{
Total = list. Count,
rows = (from the R in list
Select New Syssamplemodel ()
{
Id = R.id,
Name = R.name,
Age = R.age,
Bir = R.bir,
Photo = R.photo,
Note = R.note,
Createtime = R.createtime,
}). ToArray ()
};
Return JSON (JSON, jsonrequestbehavior.allowget);
}
In fact, the heart of the children's shoes will find the download Easyui package contains a demo file, we open the DataGrid sample folder found
{"Total": +, "Rows": [
{"ProductID": "Fi-sw-01", "ProductName": "Koi", "UnitCost": 10.00, "status": "P", "ListPrice": 36.50, "attr1": "Large", " Itemid ":" EST-1 "},
{"ProductID": "K9-dl-01", "ProductName": "Dalmation", "unitcost": 12.00, "status": "P", "ListPrice": 18.50, "attr1": " Spotted adult Female "," itemid ":" EST-10 "},
{"ProductID": "Rp-sn-01", "ProductName": "Rattlesnake", "unitcost": 12.00, "status": "P", "ListPrice": 38.50, "attr1": " Venomless "," itemid ":" EST-11 "},
{"ProductID": "Rp-sn-01", "ProductName": "Rattlesnake", "unitcost": 12.00, "status": "P", "ListPrice": 26.50, "attr1": " Rattleless "," itemid ":" EST-12 "},
{"ProductID": "Rp-li-02", "ProductName": "Iguana", "unitcost": 12.00, "status": "P", "ListPrice": 35.50, "attr1": "Green" Adult "," itemid ":" EST-13 "},
{"ProductID": "Fl-dsh-01", "ProductName": "Manx", "unitcost": 12.00, "status": "P", "ListPrice": 158.50, "attr1": " Tailless "," itemid ":" EST-14 "},
{"ProductID": "Fl-dsh-01", "ProductName": "Manx", "unitcost": 12.00, "status": "P", "ListPrice": 83.50, "attr1": "With Tail "," itemid ":" EST-15 "},
{"ProductID": "Fl-dlh-02", "ProductName": "Persian", "unitcost": 12.00, "status": "P", "ListPrice": 23.50, "attr1": " Adult Female "," itemid ":" EST-16 "},
{"ProductID": "Fl-dlh-02", "ProductName": "Persian", "unitcost": 12.00, "status": "P", "ListPrice": 89.50, "attr1": " Adult Male "," itemid ":" EST-17 "},
{"ProductID": "Av-cb-01", "ProductName": "Amazon Parrot", "UnitCost": 92.00, "status": "P", "ListPrice": 63.50, "attr1": " Adult Male "," itemid ":" EST-18 "}
]}
We see the demo JSON format in the example, and the background must return the number of JSON formats that match Easyui read
DataGrid receives JSON data format