Hello,
How to save settings for UI: resize, order, group?
When I press syncGrid() the grid sends all data to the server and reloads, so all my (resize) actions turn back to default.
Is there a way to set UI preferences from JSON, maybe? Or to configure dataProcessor on different way?
Any idea?
<html>
<head>
//localhost
<link rel="STYLESHEET" type="text/css" href="http://localhost:8080/dhtmlxGrid/codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="http://localhost:8080/dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<link rel="STYLESHEET" type="text/css" href="http://localhost:8080/dhtmlxGrid/codebase/ext/dhtmlxgrid_pgn_bricks.css">
<script src="http://localhost:8080/dhtmlxGrid/codebase/dhtmlxcommon.js"></script>
<script src="http://localhost:8080/dhtmlxGrid/codebase/dhtmlxgrid.js"></script>
<script src="http://localhost:8080/dhtmlxGrid/codebase/dhtmlxgridcell.js"></script>
<script src="http://localhost:8080/dhtmlxDataProcessor/codebase/dhtmlxdataprocessor.js"></script>
<script src="http://localhost:8080/dhtmlxDataProcessor/codebase/dhtmlxdataprocessor_debug.js"></script>
<script>
var mygrid;
var dp;
var columnWidthDhtmlx = "70,150,150,150,150,150,150,100,150,100,100";
function doInitGrid(){
mygrid = new dhtmlXGridObject("mygrid_container");
mygrid.setImagePath("codebase/imgs/");
mygrid.setHeader("Column1, Column2, Column3, Column4, Column5, Column6, Column7, Column8, Column9, Column10, Column11");
mygrid.setInitWidths(columnWidthDhtmlx);
mygrid.setColAlign("left,right,right,right,right,right,right,right,right,right,right");
mygrid.setSkin("light");
mygrid.setColSorting("str,str,str,str,str,str,str,str,str,str,str");
mygrid.attachEvent("onBeforeSorting",function(ind,type,direction){alert("onBeforeSorgi "+mygrid.getSortingState()); return true;});
mygrid.setColTypes("ed,ed,ed,ed,ed,ed,ed,ed,ed,ed,ed");
mygrid.init();
//localhost
mygrid.load("http://localhost:8080/...","json");
dp = new dataProcessor("http://localhost:8080/...");
dp.setTransactionMode("GET", true);
dp.setUpdateMode("off");
dp.defineAction("updated",responseUpdated);
dp.init(mygrid);
};
function syncGrid(){
alert("Sync Grid With DB...");
dp.sendData();
alert("Sync with DB DONE! Waiting for server response(s)...");
};
function responseUpdated(node){
alert("responseUpdated()");
alert(node.getAttribute("type"));
alert(node.firstChild.data);
};
</script>
</head>
<body onLoad="doInitGrid()">
<div id="mygrid_container" style="width:600px;height:150px;"></div>
<div>
<a href="#" OnClick="addRow();" title="Add Row">Add Row</a>
</div>
<div>
<a href="#" OnClick="removeRow();" title="Remove Row">Remove Row</a>
</div>
<div>
<button onClick="syncGrid()" id="submitButton" style="margin-left:30px;">Sync</button>
</div>
</body>
</html>
Regards