How to update datagrid

Question

I create dojox.grid.datagrid and I populate the content from the array, as in the example the last example on the page . Over time, I change the value of this array in code. How to update the contents of this grid? How to load new data from a modified array?

Answer 1

To change the values ​​in the grid, you will need to change the value in the grid store. Grid data is tied to storage data, and the grid will be updated as needed.

So, the key is to understand Dojo api data and how stores work in Dojo. Instead of manipulating data directly in the grid, manipulate it in storage.

Ideally, storage is your array that you manipulate when you start the application, and you will not need to synchronize the array with the grid. Just use ItemFileWriteStore as the owner of the data if this is not possible.

In addition, using the Dojo api data identifier makes it easier to find items in the grid, if possible. Assuming that you know when an item is updated, deleted, or changed in your application, you should be able to modify the grid store as needed when an action occurs. This is definitely the preferred approach. If you cannot do this, you will have to make a general choice and use the onComplete callback to manually synchronize your arrays, which will be very slow and will not scale well, in which case you can just create a new store all together and assign it to the grid with grid.setStore (myNewStore)

Here is the fiddle with the basic operations create, update and delete: http://jsfiddle.net/BC7yT/11/

In these examples, all are used to declare an identifier when creating a repository.

var store = new dojo.data.ItemFileWriteStore({ data: { identifier : 'planet', items: itemList } }); 

UPDATING THE CURRENT ITEM:

 //If the store is not in your scope you can get it from the grid var store = grid.store; //fetchItemByIdentity would be faster here, but this uses query just to show //it is also possible store.fetch({query : {planet : 'Zoron'}, onItem : function (item ) { var humans = store.getValue(item, 'humanPop'); humans += 200; store.setValue(item, 'humanPop', humans); } }); 

INSERT A NEW ITEM:

 store.newItem({planet: 'Endron', humanPop : 40000, alienPop : 9000}); } catch (e) { //An item with the same identity already exists } 

REMOVE ITEM:

 store.fetchItemByIdentity({ 'identity' : 'Gaxula', onItem : function (item ) { if(item == null) { //Item does not exist } else { store.deleteItem(item); } }}); 

Answer 2

To update the grid, you can use the following code fragment:

 var newStore = new dojo.data.ItemFileReadStore({data: {... some new data ...}); var grid = dijit.byId("gridId"); grid.setStore(newStore); 

EDIT:

Dogo Data Grid Reference Guide (Add / Remove Sample Rows by Updating Sample Grid Data)

Answer 3

(I suppose you already have a working grid, and you want to completely change the grid storage)

• Create a new data store with a new value:

   dataStore = new ObjectStore({ objectStore:new Memory({ data: data.items }) }); 

  (data is the response from ajax request for me)

• Change the mesh repository to a new one:

   grid.store = dataStore; 

• Render:

   grid.render(); 

Answer 4

This will update the Grid Store and update the grid view in the latest version of Dojo 1.9

 grid.store = store; grid._refresh(); 

Answer 5

I had a server-side filtered EnhancedGrid that happily freshened up, changing the repository and shown in other answers.

However, I had another EnhancedGrid that was not updated when the filter was applied. Perhaps this is due to the fact that there was filtering on the client side (but the data is still coming from the server using the JsonRest storage), but I really don't know the reason. At the same time, the solution should have been updated using the following code:

 grid.setFilter(grid.getFilter()); 

It’s hacked and weird, but if all this fails ...

Answer 6

with this i can update a specific row. this example is for treegrid.

 var idx = this.treeGrid.getItemIndex(item); if(typeof idx == "string"){ this.treeGrid.updateRow(idx.split('/')[0]); }else if(idx > -1){ this.treeGrid.updateRow(idx); }