Introduction to native paging of DWZtable _ jquery

Next, let's take a look at the code. I will introduce in detail how to use table paging in DWZ. The following is the implementation method in MVC. Recently, the table paging feature of DWZ is rarely used in project development. It is usually a table plug-in bound to a third-party data such as jqgrid or grid, which is now required by the project, you must use the table that comes with DWZ.

Next, let's take a look at the code. I will introduce in detail how to use table paging in DWZ. The following is the implementation method in MVC.

?

CurrentPage = "@ ViewBag. currentPage">

Attribute Introduction

TargetType: binding mode. DWZ provides the "navTab" and "dialog" methods. As the name suggests, the paging mode is on the tab or the pop-up layer.

TotalCount: Total number of data rows

NumPerPage: number of data rows on the current page

PageNumShown: Total number of pages

CurrentPage: Current page number

The Code is as follows:

@ Using (Html. BeginForm ("BidPrjList", "TbUnify", null, forcanchod. Post, new {id = "pagerForm "}))
{


}

Note that the id = "pagerForm" attribute must be added to the paginated form in DWZ; otherwise, it will not be executed. In DWZ, table paging actually transfers the paging Method to the background in the form of Form submission. parameters are received in the background to obtain paging information: For example:

The Code is as follows:

Request. Form ["numPerPage"]

The value of the pagination information form is the name of the hidden text field defined in the pagerForm form in the View. After receiving the information in the background, the system requests the paging data from the data source and returns it to the foreground.

However, there is a small problem: when you first enter this page, the form submission event of the current page cannot be triggered, So I defined ViewBag above. numPerPage dynamically assigns values. How many pieces of data are retrieved from each page? The front-end interface only defines the paging style, and the actual data is not bound, therefore, the paging information transmitted from the front-end must be used as the basis for data paging in the background, so that the front-end paging can be consistent with the data connection and will not cause confusion.

In actual project development, we always put tables and filtering conditions together. In DWZ, the method for passing restrictions in tables is also very simple, add the following hidden text fields to the paging form:

The Code is as follows:

In this way, the input filter conditions can be accepted in the background.

The data reload of the current tab is used to refresh the tab. If the conditions are used together with the page, a problem occurs, after page reload, your filtering conditions will be lost. Here, the solution is to add a hidden text field to the paging form, assign values to the filtering conditions each time, and check whether the filter conditions are empty in the background, whether to add filtering conditions. I hope you can pay attention to this.

Finally, the targetType is introduced above, indicating that the current paging method and the page is actually a tag page refresh, therefore, if we load the View layer containing the table as partial pages asynchronously, we will find that the paging control of DWZ won't be displayed, and thus won't be able to be paged, we have already told you that you need to specify the type for each paging. If you use $. load or @ Html. partial can only load data on the first page, which is also a defect in DWZ. After all, the rise of DWZ has also existed in recent years, and there are still many problems and bugs, in particular, the paging and Data Binding of his table is really not useful, but in general, other components and styles of DWZ are still very good.

Now, we will introduce the paging of DWZ table here today.