1,jqgrid the first load method, and the method that the query button can execute
Method 1jQuery ("#tableId"). Jqgrid ({ url: "/jqgrid/select.html", //send data postdata: {"stock": $ ("#stock"). Val (), "Name": $ ("#lastSales"). Val ()}, //Send Way mtype: "Get", datatype : "JSON", //table height height: 400, //Column Name colnames: [' ', ' ID ', ' last sales ', ' Name ', ' Stock ', ' Ship via ', ' Notes ', ' Amt '], ...}) As the most commonly used Jqgrid method, it plays a role in rendering the page and initializing some methods, and the subsequent effect is only when the method renders HTML such as table. Moreover, this method is only triggered when the page is loaded for the first time. But we do the page display, generally have to have the query button, this method is obviously not applicable, if the method is wrapped in $ ("#buttonId"). Click, there is no triggering. The specific source code is not clear. (The first time I do the query button, that is, the debug found that the code is a step-by-step down, is not adjustable to the background) then the query button should use what method, or this method, just take the parameters. This method is jqgrid the corresponding button can trigger the Query method (and must be Method 1 render a good page before you can use) $ (grid_selector). Jqgrid (' Setgridparam ', { url: "/jqgrid/select.html", //send data postdata: {"stock": $ ("#stock"). Val (), "Name": $ ("#lastSales"). Val (), "note": $ ("#notes"). Val ()}, page: 1, //This method is finished loading loadComplete: function (XHR) { alert ("Query Complete" +xhr.result); } }). Trigger ("Reloadgrid");//Reload
2, the button can be triggered by adding and removing methods,
If you do not want to use the Jqgrid left lower corner of the navigation bar and other changes, then you can use these methods
$ ("#buttonForEdit"). Click (function () {    //GR is the Id var to get edit rows gr = jquery ("#grid-table"). Jqgrid (' Getgridparam ', ' Selrow '); if (Gr != null) jquery ("#grid-table"). Jqgrid (' Editgridrow ', gr, { height: 300, reloadAfterSubmit: false }); &nBsp; else alert ("Please select row");}); $ ("#buttonForInsert"). Click (function () { jquery ("#grid-table"). Jqgrid (' Editgridrow ', "New", { height: 300, reloadaftersubmit: false }); $ ("#buttonForDelete"). Click (function () { var gr = jquery ("#grid-table"). Jqgrid (' Getgridparam ', ' Selrow '); if (gr != null) { Var result=jquery ("#grid-table"). Jqgrid (' Delgridrow ', gr, { reloadaftersubmit: false }); alert (result);} else alert ("please select row to Delete! ");});
For additions and deletions, many people will ask, where the URL is filled in,
In fact Jqgrid for these three URLs, the default is one, is the method of rendering the page a parameter, Editurl.
How do you tell the difference? For this, Jqgrid submits the URL in the background, he will add a property called Oper by default
if it's edit,url, it's going to be Http://www.xx.com/edit.html?name=xxx&age=xxx&oper=edit
If it was update,url, it would be http://www.xx.com/edit.html?name=xxx&age=xxx&oper=add.
If it was delete,url, it would be http://www.xx.com/edit.html?name=xxx&age=xxx&oper=del.
So the background can be based on Oper to determine what the operation.
Many people will ask, the navigation bar comes with the small button of add and edit, if successful, how to prompt.
I don't know about this, either.
But I found an event that could have this effect.
Aftercomplete:function executes the callback function triggered after add and edit to receive data returned in the background
Aftercomplete:function (XHR) {alert (xhr.responsetext); },//close this window after success Closeafteradd:true
xhr={readystate=4,responsetext= "Background returned information" status=200 ...}
So the backend needs to return information such as sunccess or error.
Jqgrid commonly used additions and deletions to check the demo and frequently asked questions