FineUIMvc table database page, using the CYQ. Data component, fineuimvccyq. data
First, let's take a look at the definition of the foreground View:
@ (F. grid (). enableCheckBoxSelect (true ). width (850 ). showHeader (true ). showBorder (true ). enableCollapse (true ). title ("table "). ID ("Grid1 "). dataIDField ("Id "). dataTextField ("Name "). allowPaging (true ). pageSize (5 ). isDatabasePaging (true ). onPageIndexChanged (Url. action ("Grid1_PageIndexChanged"), "Grid1 "). columns (F. rowNumberField (), F. renderField (). headerText ("name "). dataField ("Name "). width (80 ),......). recordCount (ViewBag. grid1RecordCount ). dataSource (ViewBag. grid1DataSource ))
Similar to WebForms, we also need to set some attributes to enable database paging:
1. AllowPaging (true): Enable Paging
2. IsDatabasePaging (true): Enable database Paging
3. PageSize (5): number of records per page
4. OnPageIndexChanged (Url. Action ("Grid1_PageIndexChanged"), "Grid1"): The page switching event, which needs to be sent back to the background to rebind table data.
The backend Controller that transmits the total number of datasets and records of the able type.
int total = 0; ViewBag.Grid1DataSource = DBFast.Select<db_wxuser>(1, 10, "IsDel=0", out total); ViewBag.Grid1RecordCount = total;
Page turning event
[HttpPost] [ValidateAntiForgeryToken] public ActionResult Grid1_PageIndexChanged(JArray Grid1_fields,int Grid1_pageIndex) { var total = 0; var dataSource = DBFast.Select<db_wxuser>(Grid1_pageIndex+1, 10, "IsDel=0", out total); var grid1 = UIHelper.Grid("Grid1"); grid1.RecordCount(total); grid1.DataSource(dataSource, Grid1_fields); return UIHelper.Result(); }
Note that the two parameter names of the Controller method are agreed upon. If the foreground uses the Control ID to pass in the Custom response parameter:
OnPageIndexChanged(Url.Action("Grid1_PageIndexChanged"), "Grid1")
The parameter name conventions for the backend request are as follows:
1. Table Control ID_pageIndex: Number of the current page in the table
2. Table Control ID_fields: Table fields used in the table (if it is not a table, it is an IEnumrable <Class> object, it corresponds to the Class attribute list). This value is required for data binding.
Why do we need the Grid1_fields parameter?
Many netizens may have this question, but it is easy to understand. Because the table may have many fields, assuming there are 100, only 10 of them may be used. Then, only the data of the 10 fields will be returned during data binding.
If this parameter is not input during data binding, it can also be run, but it will return a lot of redundant data and may cause key data leaks (such as passwords ).
Finally, let's take a look at the request body in MVC:
Response body:
F. ui. grid1.setRecordCount (22); F. ui. grid1.loadData ([106, "Zhang Bo", 1, 2003, true, "Financial Management", 3, "2017-01-13T07: 22: 51Z"], [107, "Yang Qian ", 0, 2000, false, "material physics and chemistry", 4, "2017-01-23T07: 22: 51Z"], [108, "Dong Chao", 1, 2004, false, "Biomedical Engineering", 4, "2017-02-02T07: 22: 51Z"], [109, "Zhang xiaojuan", 0, 2003, true, "material physics and chemistry", 5, "2017-02-12T07: 22: 51Z"], [110, "Ye peng", 1, 2006, false, "e-commerce", 5, "2017-02-22T07: 22: 51Z"]); f. ui. grid1.clearSelection ();