jqgrid treegrid how to reload data? - javascript

I know how to reload normal jqgrid table. I used the same method to reload treegrid, but it doesn't work.
The usual method to reload jqgrid:
$jqGrid.jqGrid('setGridParam',{
url:path+"/admin/demo/getLogsGridJson.do",
postData:{'aaa':111,'bbb':222}, //
page:1
}).trigger("reloadGrid");
This way I can again request and refresh data. But with treegrid it doesn't work.
How to reload treegrid to use new postData or new url?

To reload the jqGrid TreeGrid with new post data you will need to set treedattype to json like this
$jqGrid.jqGrid('setGridParam',{
url:path+"/admin/demo/getLogsGridJson.do",
postData:{'aaa':111,'bbb':222}, //
page:1,
treedatatype : 'json'
}).trigger("reloadGrid");
More about why is this you can read in Guriddo jqGrid Documenatation here
Kind Regards

Try to reset treeANode parameter of TreeGrid to -1. You can replace unneeded setting of page:1 to treeANode:-1. You can consider to add data: [], _index: {} to the options of setGridParam to improve the performance if you loaded previously large set of data.

Related

JQGRID persists in posting the original postData value when using reloadGrid

My initial grid is build
$("#dims_list").jqGrid({
url: "ajax_get_dims_for_grid.php",
postData: {'dims_guid': $('#dims_guid').val()},
When I refresh the grid with a new parameter the original value is sent (persists)
var dims_guid = $("#dims_guid").val(); // New value for the grid
$("#dims_list").jqGrid('setGridParam',{"dims_guid":dims_guid}).trigger('reloadGrid');
I have monitored this in the Chrome developer window and can see the new value in var dims_guid but the old value is posted to the page that retrieves the data from the database.
I have just moved from freeJQgrid to Guriddo jqGrid
I actually tried the following code
var url="ajax_get_dims_for_grid.php?dims_guid="+$("#dims_guid").val();
$("#dims_list").jqGrid('setGridParam',{"url":url}).trigger('reloadGrid');
And in Chrome the query string was duplicated with the old one taking precedence
Query String Parameters
dims_guid: 100d7c6d-bcba-4b13-8832-f9de7794498c
dims_guid: dbc02dbe-e3d8-4b7d-8389-2678221ea189
_search: false
nd: 1586531572226
rows: 20
page: 1
sidx:
sord: asc
Is this a known issue?
If a postData is used to send parameters to the server this parameter (postData) extend every time the parameters that are posted to the server if a request is made. As per documentation. This array is appended directly to the url.
The problem you have is that you do not have correctly set the new parameter when you trigger the grid. What you do is:
var dims_guid = $("#dims_guid").val(); // New value for the grid
$("#dims_list").jqGrid('setGridParam' {"dims_guid":dims_guid}).trigger('reloadGrid');
This way you append new parameter th the grid and do not have change the existing one. In order to make it correct it is needed to change this in postData like this
var dims_guid = $("#dims_guid").val(); // New value for the grid
$("#dims_list").jqGrid('setGridParam',{ "postData" : { "dims_guid":dims_guid} }).trigger('reloadGrid');
I hope you understand the difference.
Another possible solution is to not use postData (remove postData from options) , but use url only to change the parameter, like you do in your second published code. Like this:
$("#dims_list").jqGrid({
url: "ajax_get_dims_for_grid.php?dims_guid="+$("#dims_guid").val(),
and then
var url="ajax_get_dims_for_grid.php?dims_guid="+$("#dims_guid").val();
$("#dims_list").jqGrid('setGridParam',{"url":url}).trigger('reloadGrid');

Datatable client-side data change/redraw

I set up a datatables that initially gets from server some data and represents it, but then everything is left to the client. Some options are:
serverSide: false,
sAjaxSource: mySource,
My $.fn.DataTable.version is 1.10.2.
Then I need to change, client-side, the aaData under the table because some working on data is performed. I need to update the DT to show the client-altered temporary data without send another request to server (for two reason: prevent useless traffic and because that data is being altered).
I am looking for a way to edit the underlying DT databean to edit it, so then calling again
myTable.draw();
on my table I obtain a refresh realtime without sending another get to the server.
The question is, can I access DT data array, and can I edit it?
How is it done if is possible?
EDIT: I need to feed the table the full bean array as it initially took from the server, same format. So individual row/cell add/edit and client-side building functions are not suitable in my case, unless I manually cicle all objects.
SOLUTION
Use the code below:
// Retrieve data
var data = table.ajax.json();
// Modify data
$.each(data.data, function(){
this[0] = 'John Smith';
});
// Clear table
table.clear();
// Add updated data
table.rows.add(data.data);
// Redraw table
table.draw();
DEMO
See this jsFiddle for code and demonstration.

Refresh button to call javascript function

In a page, I have a form and a JQGrid. The form is used to enter specific filters. So the Javascript for that page contains a function which reloads the data in order to populate the JQGrid. The JQGrid has loadonce: true, so the refresh button doesn't do anything. I would need to make it call my existing function. Is it possible ?
If I understand you correctly then your problem exist because loadonce: true option changes the original datatype ("json" or "xml") to "local". It allows to use local paging, sorting and filtering of data. During the paging, filtering and sorting the grid will be reloaded, so local reloading do have sense.
If you need to reload the grid from the server you should first restore the original value of datatype and then do reloading.
So if you can use beforeRefresh callback of navGrid to reset datatype:
$("#grid").jqGrid("navGrid", "#pager", {
beforeRefresh: function () {
$(this).jqGrid("setGridParam", {datatype: "json"});
}
});
If you use free jqGrid then you can use new fromServer: true option of reloadGrid and you can use new style of options and new reloadGridOptions option of navGrid. The code will be like
$("#grid").jqGrid({
// standard jqGrid options
navOptions: {
// default options of navGrid
reloadGridOptions: {fromServer: true}
}
}).jqGrid("navGrid");
It will work with datatype:"json" or datatype:"xml".
A simple enough fix:
loadonce: false
really, setting this to true will serve no other purpose that you have specified.

jqGrid - Submit Grid ID In POST Data

I have multiple grids on a single page so my PHP needs to know which jqGrid POST data came from. I thought I could easily use something such as:
jQuery('#grid1').jqGrid({
...
postData:
{
grid: function() { return $(this).attr('id'); }
},
...
});
POST certainly contains grid but the value is populated. For testing I put...
alert($(this).attr('id'));
...elsewhere in my code and it displayed the grid name. I'm not sure how/where to get the value into POST though.
Your help is appreciated, thank you.
I simply added a new field to the POST which contains the "type" of data being submitted so my API knows what it is being handed.

jqGrid: reload data from json-string

I know, that there is several similar questions are exists on SO, but despite it I creating this question because:
- I still don't get it :)
- I want to create a topic that possibly will cover a problem more complete.
I reconstructed my production setup in simplified way, it available by link below.
In short - I have simple jqGrid, that uses jsonstring as dataType, and datastr with JSON data. And then by firing this:
$("#grid").setGridParam({'datastr': myNewData}).trigger('reloadGrid');
Im trying to reload data in grid, but it just doesnt work.
What am I missing?
ps
Also it is matter for me, that grid has summary row which defined with userdata.
DOWNLOAD SETUP
It's very seldom that you really need to use datatype which values other as "local", "json", "jsonp" or "xml". Most usage of other datatype can be easy replace to the tree main datatypes. If you use "jsonstring", "xmlstring" or "clientSide" then the datatype will be changed to "local" after loading of data (see the line of source code for example). So if you really need to use datatype: "jsonstring" you can fix reloading by usage
$("#grid").setGridParam({
datastr: myNewData,
datatype: "jsonstring" // !!! reset datatype
}).trigger("reloadGrid");
Additionally I could see that you used pager: false option of jqGrid. It's wrong option. If you don't need to use local paging of data I recommend you
don't include and pager option. Default value pager: "" is already OK.
include rowNum parameter with some large enough value like rowNum: 10000. Default value of rowNum is 20. So if you don't want to display only the first 20 rows of the input data you should increase the value of rowNum.
The last recommendation: you should include sorttype: "integer" (see the documentation) to columns which holds integer values. It will fix sorting of data if the user clicks on the column header. You should consider to use column templates too (see the old answer).

Categories