webismymind / editablegrid

EditableGrid is an open source Javascript library aimed at turning HTML tables into advanced editable components. It focuses on simplicity: only a few lines of code are required to get your first table up and running.
http://www.editablegrid.net
Other
795 stars 272 forks source link

Issue in loadJSONFromString(json) function of the editablegrid.js when passing json string as a parameter #113

Open gauravhkulkarni opened 8 years ago

gauravhkulkarni commented 8 years ago

Hi All,

I am using editable grid for some CRUD operations. While trying to pass my json string object to loadJSONFromString(json) method. Below is the code i have written in demo.js which is similar to loadJSON(url) function (this works as expected when we pass the url of file)


in index.html

    var jsondata1={"metadata":[
{"name":"name","label":"NAME","datatype":"string","bar":true,"editable":true,"values":null},
{"name":"firstname","label":"FIRSTNAME","datatype":"string","bar":true,"editable":true,"values":null},
{"name":"age","label":"AGE","datatype":"integer","bar":true,"editable":true,"values":null},
{"name":"height","label":"HEIGHT","datatype":"double(m,2)","bar":false,"editable":true,"values":null},
{"name":"country","label":"COUNTRY","datatype":"string","bar":true,"editable":true,"values":
    {
        "Europe":{"be":"Belgium","fr":"France","uk":"Great-Britain","nl":"Nederland"},
        "America":{"br":"Brazil","ca":"Canada","us":"USA"},
        "Africa":{"ng":"Nigeria","za":"South-Africa","zw":"Zimbabwe"}}
    },
{"name":"email","label":"EMAIL","datatype":"email","bar":true,"editable":true,"values":null},
{"name":"freelance","label":"FREELANCE","datatype":"boolean","bar":true,"editable":true,"values":null},
{"name":"lastvisit","label":"LAST VISIT","datatype":"date","bar":true,"editable":true,"values":null},
{"name":"action","label":"","datatype":"html","bar":true,"editable":false,"values":null}

],

"data":[ {"id":"1","values":{"name":"Hoffman","firstname":"Tatyana","age":"88","height":"1.32","country":"ca","email":"Nam@quisdiamluctus.json.org","freelance":"1","lastvisit":"17\/04\/2012","action":""}}, {"id":"2","values":{"name":"Atkins","firstname":"Ishmael","age":"44","height":"1.42","country":"uk","email":"arcu.et.pede@musProin.ca","freelance":"1","lastvisit":"12\/01\/2011","action":""}} ]};

window.onload = function() { editableGrid.onloadJSONFromString(jsondata1); });


in Demo.js

EditableGrid.prototype.onloadJSONFromString = function(json) { // load JSON URL this.loadJSONFromString(json); // register the function that will be called when the XML has been fully loaded this.tableLoaded = function() { displayMessage("Grid loaded from JSON: " + this.getRowCount() + " row(s)"); this.initializeGrid(); };

};

I could see complete data parsing is happening during page load. But table is not getting loaded.

Requesting you to please look into this as I dont want to load the json from file as it will be overhead for performance and maintenance of file is another task for user.

webismymind commented 8 years ago

Hello,

The "tableLoaded" callback is called only in asynchronous operations (i.e. when loading from an URL). When using "loadJSONFromString", you simply have to do this:

this.loadJSONFromString(...); displayMessage("Grid loaded from JSON: " + this.getRowCount() + " row(s)"); this.initializeGrid();

Hope this helps.

2016-01-22 8:16 GMT+01:00 gauravhkulkarni notifications@github.com:

Hi All,

I am using editable grid for some CRUD operations While trying to pass my json string object to loadJSONFromString(json) method Below is the code i have written in demojs which is similar to loadJSON(url) function (this

works as expected when we pass the url of file)

in indexhtml

var jsondata1={"metadata":[

{"name":"name","label":"NAME","datatype":"string","bar":true,"editable":true,"values":null}, {"name":"firstname","label":"FIRSTNAME","datatype":"string","bar":true,"editable":true,"values":null}, {"name":"age","label":"AGE","datatype":"integer","bar":true,"editable":true,"values":null}, {"name":"height","label":"HEIGHT","datatype":"double(m,2)","bar":false,"editable":true,"values":null}, {"name":"country","label":"COUNTRY","datatype":"string","bar":true,"editable":true,"values": { "Europe":{"be":"Belgium","fr":"France","uk":"Great-Britain","nl":"Nederland"}, "America":{"br":"Brazil","ca":"Canada","us":"USA"}, "Africa":{"ng":"Nigeria","za":"South-Africa","zw":"Zimbabwe"}} }, {"name":"email","label":"EMAIL","datatype":"email","bar":true,"editable":true,"values":null}, {"name":"freelance","label":"FREELANCE","datatype":"boolean","bar":true,"editable":true,"values":null}, {"name":"lastvisit","label":"LAST VISIT","datatype":"date","bar":true,"editable":true,"values":null}, {"name":"action","label":"","datatype":"html","bar":true,"editable":false,"values":null}

],

"data":[

{"id":"1","values":{"name":"Hoffman","firstname":"Tatyana","age":"88","height":"132","country":"ca","email":"Nam@quisdiamluctusjsonorg ","freelance":"1","lastvisit":"17\/04\/2012","action":""}},

{"id":"2","values":{"name":"Atkins","firstname":"Ishmael","age":"44","height":"142","country":"uk","email":"arcuetpede@musProinca ","freelance":"1","lastvisit":"12\/01\/2011","action":""}} ]};

windowonload = function() { editableGridonloadJSONFromString(jsondata1);

});

in Demojs

EditableGridprototypeonloadJSONFromString = function(json) { // load JSON URL thisloadJSONFromString(json); // register the function that will be called when the XML has been fully loaded thistableLoaded = function() { displayMessage("Grid loaded from JSON: " + thisgetRowCount() + " row(s)"); thisinitializeGrid(); }; };

I could see complete data parsing is happening during page load But table is not getting loaded

Requesting you to please look into this as I dont want to load the json from file as it will be overhead for performance and maintenance of file is another task for user

— Reply to this email directly or view it on GitHub https://github.com/webismymind/editablegrid/issues/113.

gauravhkulkarni commented 8 years ago

Thank you so much webismymind. Your approach worked for me. was struggling to get this done since last 15 days.