jQuery UI Widgets › Forums › TreeGrid › treegrid server side editing
Tagged: ajax, server edit, server update
This topic contains 1 reply, has 2 voices, and was last updated by Peter Stoev 7 years, 4 months ago.
-
Author
-
hi
please look at the code blew:$(document).ready(function () { var newRowID = null; var theme = ""; var data = {}; // prepare the data var source = { dataType: "json", type: 'POST', dataFields: [ { name: "id", type: "number" }, { name: "Name", type: "string" }, { name: "ParentId", type: "number" }, ], hierarchy: { keyDataField: { name: 'id' }, parentDataField: { name: 'ParentId' } }, id: 'id', url: '/Admin/GetGroups', addRow: function (rowID,rowData, position, parentID, commit) { newRowID = rowID; var data = "update=true&Name=" + rowData.Name; data = data + "&id=" + rowData.id + "&ParentId" + rowData.parentID; $.ajax({ cache: false, dataType: 'json', url: '/Admin/AddGroup', data:data, type: "POST", success: function (data, status, xhr) { // insert command is executed. commit(true); alert("success add" + "" + "data:" + data); alert("parentID: " + parentID + " rowID: " + rowID); }, error: function (jqXHR, textStatus, errorThrown) { alert(errorThrown); commit(false); } }); }, updateRow: function (rowID, rowData, commit){ setTimeout(function () { commit(true); alert("Called"); }, 1000); var data = "update=true&Name=" + rowData.Name + "&ParentId=" + rowData.ParentIdValue; data = data + "&id=" + rowData.id; $.ajax({ dataType: 'json', url: '/Admin/UpdateGroup', type: 'POST', data: data, success: function (data, status, xhr) { alert("update success"); alert("data:"+data); commit(true); }, error: function (errorThrown) { alert(errorThrown); commit(false); } }); }, deleteRow: function (rowID, commit) { // synchronize with the server - send delete command // call commit with parameter true if the synchronization with the server is successful // and with parameter false if the synchronization failed. console.log(rowID); commit(true); } }; var dataAdapter = new $.jqx.dataAdapter(source, { loadComplete: function () { // data is loaded. } }); $("#treeGrid").jqxTreeGrid( { . . . . . addButton.click(function (event) { if (!addButton.jqxButton('disabled')) { $("#treeGrid").jqxTreeGrid('expandRow', rowKey); // add new empty row. $("#treeGrid").jqxTreeGrid('addRow',null, {}, 'first', rowKey); // select the first row and clear the selection. $("#treeGrid").jqxTreeGrid('clearSelection'); alert("newRowID: " + newRowID); $("#treeGrid").jqxTreeGrid('selectRow', newRowID); // edit the new row. $("#treeGrid").jqxTreeGrid('beginRowEdit', newRowID); updateButtons('add'); } }); cancelButton.click(function (event) { if (!cancelButton.jqxButton('disabled')) { // cancel changes. $("#treeGrid").jqxTreeGrid('endRowEdit', rowKey, true); } }); updateButton.click(function (event) { if (!updateButton.jqxButton('disabled')) { // save changes. $("#treeGrid").jqxTreeGrid('endRowEdit', rowKey, false); } }); editButton.click(function () { if (!editButton.jqxButton('disabled')) { var ParentIdValue = $("#treeGrid").jqxTreeGrid('getCellValue', rowKey, 'ParentId'); alert("parentid:" + ParentIdValue); $("#treeGrid").jqxTreeGrid('beginRowEdit', rowKey); updateButtons('edit'); } }); . . . deleteButton.click(function () { if (!deleteButton.jqxButton('disabled')) { var selection = $("#treeGrid").jqxTreeGrid('getSelection'); if (selection.length > 1) { var keys = new Array(); for (var i = 0; i < selection.length; i++) { keys.push($("#treeGrid").jqxTreeGrid('getKey', selection[i])); } $("#treeGrid").jqxTreeGrid('deleteRow', keys); } else { $("#treeGrid").jqxTreeGrid('deleteRow', rowKey); } updateButtons('delete'); } }); }, columns: [ { text: 'GroupName', dataField: "Name", align: 'right', width: '350' }, ], }); });
for example when i edit one row and click on update button in toolbar ajax acting right and show’s me “update success” message in ajax success function
but data does’t transfer to server and editing action not working.
but when i remove ParentId from ajax data property:updateRow: function (rowID, rowData, commit){ setTimeout(function () { commit(true); alert("Called"); }, 1000); var data = "update=true&Name=" + rowData.Name; data = data + "&id=" + rowData.id; $.ajax({ dataType: 'json', url: '/Admin/UpdateGroup', type: 'POST', data: data, success: function (data, status, xhr) { alert("update success"); alert("data:"+data); commit(true); }, error: function (errorThrown) { alert(errorThrown); commit(false); } }); },
edit action works but parentid changes to null.
what is problem?Regards,
Rio.Hi Rio,
First, remove setTimeout(function () { commit(true); alert(“Called”); }, 1000); from the updateRow call. Then, for the editing part, I suggest you to check your server code if the AJAX call is successful. If the AJAX call is not successful, then debug this part of the code. The client-server part of the editing depends only on your custom code and as we don’t have access to your pc & server, we would be able to help only with advices.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.