jQuery Grid Plugin - jqGridForum

Topic RSS

Combine Ajax & Local Data

26/08/2010
12:48

sternr

Member

Members

Forum Posts: 7

Member Since:
25/02/2010

Offline

Hi,

I know you can specify an ajax data source (a url to a request with an JSON respone) or to a local JSON array.

But is it possible to specifiy that the first page's source is a JSON array, but subsequent requests (meaning other pages) are from the Ajax data source?

This could be very handy since you can render the first page's data as an array, and save the first request to the server.

Is this possible?

Thanks

--sternr

06/09/2010
14:08

OlegK

Germany

Member

Members

Forum Posts: 1255

Member Since:
10/08/2009

Offline

Hi sternr,

It seems to me it is very simple to implement your requirements. To be able to load local json you should define data: myData and datatype: 'local' or datastr: myJsonDataAsString and datatype: 'jsonstring' (depend on whether you have you JSON data alredy as an object myData or as a JSON string myJsonDataAsString). After the grid is created you can imediately change the grid datatype to 'json' with respect of setGridParam method (without calling of trigger('reloadGrid')):

jQuery("#list").jqGrid('setGridParam', { datatype: 'json' });

Next refresh of the grid (also sorting of a column or searching) will be send to the server. If you want that switching to the server data will be a little later, you can call setGridParam later.

Best regards
Oleg

19/09/2010
05:10

waiting

Member

Members

Forum Posts: 40

Member Since:
22/12/2008

Offline

thanks OlegK ,with your method i can save the first page'data in localStorage and after load init with local data then switch to remote.

31/10/2010
23:30

pchan

Member

Members

Forum Posts: 9

Member Since:
05/10/2008

Offline

Hi all,

I've just started to use this fantastic plugin and wish to thank everybody especially Tony.

This package is well integrated into DB, and even the sorting order works out-of-the-box !

However, it may be too much for a big application. A request would be for additional detail. A truely AJAX request would be to ask for the detail in addition to that already sent, so the grid needs to fill the new data into the required cells then show the additional column(s), somewhat similar to the goal of sternr to have local and ajax'ed data. I plan to have up to many tens' of additional columns.

To do this, I have to rewrite the populate / sortData methods in grid.base.js. Since this is deeply integrated into the grid's core, I may face heavy maintenance for every new version or well lock myself out of further changes in the trunk !

Is there any way out of this ?

01/11/2010
09:39

OlegK

Germany

Member

Members

Forum Posts: 1255

Member Since:
10/08/2009

Offline

Sorry pchan but I don't really understand which changes in the AJAX request you need. If you need to send additional information in the AJAX request you can use /jqgridwiki/doku.php?id=wiki:options).

Moreover jqGrid has ajaxGridOptions parameter and serializeGridData event which allows you to replace practically any ajax parameter so you can make the most modification without changing of the grid.base.js code.

If all what I wrote not help you, you should post the example of the modification which you made to clear better your suggestions.

Best regards
Oleg

01/11/2010
23:22

pchan

Member

Members

Forum Posts: 9

Member Since:
05/10/2008

Offline

OlegK, in my particular application where the grid is displaying lots of data in various rows and columns. When the user wants to have more detail on a specific cell (not row) by clicking it; the idea is to open up extra columns to show this extra detail. Something like a subgrid but in a vertical way. It would be wasteful to calculate and send all the existing data, including that of the extra detail; just send the extra detail would be sufficient. This reminds me of my previous applications where ajax updates only that part of the screen that needs updating.This helps to make applications that are fluid and responsive.

Why not update only that part of the grid that needs updating (where more detail requested by user). How would you use jqGrid to do this in a general way ? maybe using a complete MVC architecture where jqGrid is the visual component ?

And many thanks for discussing, OlegK.

13/11/2010
22:20

pchan

Member

Members

Forum Posts: 9

Member Since:
05/10/2008

Offline

Just to complete the previous post :

- JQGrid with local data -- un complex Javascript object with eventually empty arrays to signify data not yet loaded

- User actions eg. buttons or clicking on specific cells or column header are used to set specific members of a control objet

- Define your own display routine that displays local data on the grid, based on the control object; whenever the display routine finds data missing, eg. when scrolled or paged, then it would use ajax to get missing data only.

That will get you a fantastic MVC application on the browser, the grid being the visual component, the local memory being M, and the controller decides what to show. Net traffic is reduced to the maximum, based on required data, so it's very fast.

The server should be asked regularly to send data that is changed (w.r.t. given dates).

Of course, all this is possible only with a powerful and dependable grid component !

Cheers!

03/12/2013
11:45

olegkn

Ukraine

Member

Members

Forum Posts: 5

Member Since:
20/01/2010

Offline

Hi! I need to set total pages and record count in creation grid with "datatype: 'local'" for view pages info in pager after switch to "datatype:'json'".

Set data by "datatype: 'jsonstring'" and "data:{'page':1,'total':2376,'records':'23754','rows':[10 rows]}" shows pages/record count from length of rows.

It is work if I use direct access to grid propertis, through "grid[0].p":

var gridData = {'page':1,'total':2376,'records':'23754','rows':[10 rows]};

var grid = $('#services').jqGrid({

datatype: 'local',
data: gridData.rows,

........

});

grid[0].p.lastpage = gridData.total;
grid[0].p.records = gridData.records;
grid[0].updatepager(false, true);

Is it more simple and correct way to do this?

04/12/2013
12:23

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Hello,

When datatype is local the page, records and total does not take in account. They are calculated within grid ( not sure if this is a good solution).

Your code is correct way to do this. Maybe you can use setGridparam.

Regards

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

05/12/2013
06:18

olegkn

Ukraine

Member

Members

Forum Posts: 5

Member Since:
20/01/2010

Offline

Thanks! setGridparam works fine, but updatepager can use only through direct access.

05/12/2013
12:42

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Hello,

Unfortunatley yes. The updatepager can be called this way.

Regards

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.