[SOLVED] Problem with loading data

[Pierre]

Hello
I'm loading data to dg using JSON file, something like $('#dg').datagrid('load', 'file.json');  
I need sometime to clear dg data and I'm using $('#dg').datagrid('load'); for that.
Problem is - dragging does not work any more when reloading data.
I made example here:
http://code.reloado.com/oeasyrik1/103/edit
and here is file.json content:

Code:

 {"total":12,"rows":[
		{"id":160550,"itemid":"1","1productid":"11111","listprice":"kom","unitcost": "7.3","attr1":"122.18000000","status":"940.62","attr2":"25.00"},
		{"id":160769,"itemid":"2","1productid":"22222","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":160770,"itemid":"3","1productid":"33333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":192648,"itemid":"4","1productid":"33333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":192649,"itemid":"5","1productid":"33333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":192650,"itemid":"6","1productid":"33333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":192651,"itemid":"7","1productid":"33333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":192652,"itemid":"8","1productid":"33333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":192653,"itemid":"9","1productid":"33333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":192654,"itemid":"10","1productid":"3333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":192655,"itemid":"11","1productid":"3333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"},
		{"id":192656,"itemid":"12","1productid":"3333","listprice":"kom","unitcost": "7.2","attr1":"122.18000000","status":"879.70","attr2":"25.00"}
		]}

so please put the above content to file.json before running example.
Steps (after creating file.json)
- run the example
- press "Click to load" button - data is loaded and dragdrop works
- press "Click to load" button again - dragdrop does not work
Thank you.

[stworthy]

Please look at this example http://code.reloado.com/oeasyrik1/104/edit#preview

[Pierre]

Hello,
yes, that works but I need to load JSON file from server so instead of

      $('#dg').datagrid('loadData',data);

I'm using

      $('#dg').datagrid('load', 'file.json'); 

Thank you for your help.

[stworthy]

That is no problem to call 'load' method. Please look at this example http://code.reloado.com/oeasyrik1/105/edit#preview. It emulates the loading data from remove server.

[Pierre]

Hello Stworthy
please let me ask on other way:
how to clear data-grid once I loaded it using
$('#dg').datagrid('load', 'file.json');
Please let me explain:
I have 3 data-grids, A,B,C
When I click on A, it displays filtered records on B - that's OK
When I click on B, it displays filtered records on C - that's OK
Now, when I click on A it must clear records on C. Here I have a problem because I don't know how to clear records, because:
$('#C').datagrid('loadData', {"total":0,"rows":[]});
does not work (because I'm not using "loadData" but "load")
to clear records, I'm using:
$('#C').datagrid('load','empty.json'); (empty.json file contains this: {"total":0,"rows":[]})
and after that, records are cleared but I have no dragDrop functionality on dg "C" any more, even I have declared it on onLoadSuccess event ($('#C').datagrid('enableDnd'))
Thank you.

[stworthy]

Please look again at this example http://code.reloado.com/oeasyrik1/106/edit#preview

When you clear the data and load it again, the drag-drop functionality is enabled. Why does it lose in your program?

[Pierre]

Hello Stworthy
I created simple example (attached) so please check:
- when you run it "as is", it will not execute onLoadSuccess, but if you remove
view:scrollview (from "dg" options), it will execute onLoadSuccess (which is correct because I call "load" twice).
Thank you.

[stworthy]

The 'loadData' method loads data immediately without any delays. The 'load' method loads data async from remote server. Please look at your code:

Code:

function loadMe(){
  $('#dg').datagrid('load','empty.json');
  $('#dg').datagrid('load','file.json');  
}

When calling 'load' method to load 'empty.json', the datagrid does not clear because the 'load' method works in async mode. You have to wait until it loads data successfully before calling next statement.

If you just need to clear the datagrid, calling 'loadData' method is a better solution.

Code:

function loadMe(){
  $('#dg').datagrid('loadData',[]);
  $('#dg').datagrid('load','file.json');  
}

[Pierre]

Hello Stworthy
that was my initial question:
"how to clear data-grid once I loaded it using $('#dg').datagrid('load', 'file.json');"

I was used
$('#dg').datagrid('loadData',{"total":0,"rows":[]});
and now I also try your suggestion:
$('#dg').datagrid('loadData',[]);
but it does not work - data is still in the grid..

[stworthy]

To clear the datagrid data, please call:

$('#dg').datagrid('loadData',[]);

This statement does clear the datagrid data.

[Pierre]

Hello
please check attached example.
First click on "Click to Load" button and then on "Clear" button.
Clear button use $('#dg').datagrid('loadData',[]); but data is not cleared.
Thank you

[stworthy]

When you call $('#dg').datagrid('load', 'file.json'); The 'url' property will be set to 'file.json'. So if the datagrid is empty, it will try to retrieve data from remove server. i.e. from the 'file.json'. This is why the data is loaded again. To solve this issue, please remove the 'url' property before calling the 'loadData' to clear the data.

Code:

$('#dg').datagrid('options').url = null;
$('#dg').datagrid('loadData', []);

[Pierre]

Just awesome, thank you so much, it works perfect!