The first is the principle:
In a data table implemented using the Easyui DataGrid, there are two ways to register the DataGrid component, namely, class and JavaScript,
The class method is to add class= "Easyui-datagrid" to the table label, for example:
<table id= "DG" title= "class=" Easyui-datagrid "></table>
The JavaScript method is:
$ (' #dg '). DataGrid ({//This fills in the parameters of the initialization DataGrid});
These two registration methods cannot coexist, otherwise it will cause two loads.
Setting the URL in the JavaScript registration method automatically triggers the query, but it is undesirable to implement the query function in this way, because it will render the DataGrid every time the query is rendered again.
Correct is the idea is: Register the DataGrid only once on the page (if you do not need to go to the page directly query, then do not set the URL), and then at query time by obtaining the DataGrid's options to set the URL, and then use the load or reload method to query, the example is as follows:
$ (function () {
INITDG ();
});
function Querydata () {
var opts=$ ("#dg"). DataGrid ("Options");
if (null==opts.url| | "") ==opts.url) {
opts.url= "xxx.action";
}
$ ("#dg"). DataGrid ("Reload");
}
function INITDG () {
$ (' #dg '). DataGrid ({
url:s_url,//requires immediate query when URL pagenumber:1 is turned on
,
queryparams: $ (' #form '). SerializeObject ()
});
}
Add: Use reload to overload, there may be a page number display error problems (such as I select the third page, and then enter the query criteria for the query, the results of the query is normal, but the paging parameters will stay on the third page),
Overloading with load does not have this problem