jquery - Retrieve data from handsontable to Struts2 Action via JSON not working -
i using struts2-json plugin generate json data , ajax populate table (handsontable) data json (according source).
now, need retrieve data table struts2 action using ajax json. first i've implemented populating table data passed json struts2 action handsontable, quite easy , works. why save not work can see in attached code below?
as see in firebug post sent , in debug request retrieved in jsonsaveaction action field data not being populated json data, why? data shouldn't binded java object automatically struts2-json plugin? doing wrong?
in handsontable part function handsontable.getdata() responsible getting whole data table. using without success:
$.ajax({ url: "../json/savejsondataaction.action", data: {data: handsontable.getdata()}, //returns cells' data datatype: 'json', type: 'post', success: function (res) { if (res.result === 'ok') { $console.text('data saved'); } else { $console.text('save error'); } } }); the function handsontable.getdata() retrieve data checked instead of data not binded java object list<report> data in jsonsaveaction action. know why?
here screenshot table , firebug info after post request: 
action sending json handsontable (working fine):
@parentpackage("json-default") @action(value="getjsondataaction") @result(name="success", type="json") public class jsondataaction extends actionsupport { private static final long serialversionuid = 1l; private list<report> data = new arraylist<report>(); public jsondataaction(){ data.add(new report(1, "chris", true, "2008-01-01", "orange")); data.add(new report(2, "kate", false, "2013-03-03", "blue")); data.add(new report(3, "blade", true, "2013-05-03", "black")); data.add(new report(4, "zack", false, "2013-01-01", "yellow")); } public string execute() { return success; } public list<report> getdata() { return data; } public void setdata(list<report> data) { this.data = data; } } json sent populate table generated automatically:
{"data":[ {"active":true,"color":"orange","date":"2008-01-01","id":1,"name":"chris"}, {"active":false,"color":"blue","date":"2013-03-03","id":2,"name":"kate"}, {"active":true,"color":"black","date":"2013-05-03","id":3,"name":"blade"}, {"active":false,"color":"yellow","date":"2013-01-01","id":4,"name":"zack"}] } action retrieving data table via json (not working):
here field list<report> data null, not populated data json :(
@parentpackage("json-default") @action(value="savejsondataaction") @result(name="success", type="json") public class jsonsaveaction extends actionsupport { private static final long serialversionuid = 1l; private list<report> data; public jsonsaveaction(){ } public string execute() { try { jsonobject jsondata = (jsonobject) jsonserializer.tojson(data); string name = jsondata.getstring("name"); } catch (exception e) { e.printstacktrace(); } return success; } public list<report> getdata() { return data; } public void setdata(list<report> data) { this.data = data; } } report class:
public class report { private int id; private string name; private boolean active; private string date; private string color; //getters , setters } load & save data , table via json:
<div id="spreadsheet"> <p> <button type="button" name="load">load</button> <button type="button" name="save">save</button> </p> </div> <div id="console" class="console"></div> <script> var $container = $("#spreadsheet"); var $console = $("#console"); var $parent = $container.parent(); $container.handsontable({ startrows: 4, startcols: 20, rowheaders: true, colheaders: true, contextmenu: true, columns: [ {data: "id", type: 'text'}, {data: "name", type: 'text'}, {data: "active", type: 'checkbox'}, {data: "date", type: 'date'}, {data: "color", type: 'autocomplete', source: ["yellow", "red", "orange", "green", "blue", "gray", "black", "white"] } ] }); var handsontable = $container.data('handsontable'); $parent.find('button[name=load]').click(function () { $.ajax({ url: "../json/getjsondataaction.action", datatype: 'json', type: 'get', success: function (res) { handsontable.loaddata(res.data); $console.text('data loaded'); } }); }); $parent.find('button[name=save]').click(function () { $.ajax({ url: "../json/savejsondataaction.action", data: {data: handsontable.getdata()}, //returns cells' data datatype: 'json', type: 'post', success: function (res) { if (res.result === 'ok') { $console.text('data saved'); } else { $console.text('save error'); } }, error: function () { $console.text('save error.'); } }); }); </script> please me how retrieve data table java object correctly, because blocked me. not know doing wrong...
big input!
i've fixed it.
1: in struts.xml add:
<interceptor-ref name="json"> <param name="enablesmd">true</param> </interceptor-ref> 2: in ajax request add:
contenttype: 'application/json' 3: change json format automatically bad formatted handontable. there in json characters like: %5b %5d %7b %7d %22 instead of: [ ] { } "
i've replaced them own fixedencodeuri() function:
var data = '{"data":' + fixedencodeuri(json.stringify(handsontable.getdata())) + '}'; $.ajax({ url: "../json/savejsondataaction.action", data: data, //returns cells' data datatype: 'json', contenttype: 'application/json', type: 'post', success: function (res) { } }); function fixedencodeuri (str) { return encodeuri(str).replace(/%5b/g, '[').replace(/%5d/g, ']').replace(/%7b/g, '{').replace(/%7d/g, '}').replace(/%22/g, '"'); }
Comments
Post a Comment