jQWidgets Forums
jQuery UI Widgets › Forums › Grid › [CRUD] doesn't work when i try update
This topic contains 1 reply, has 2 voices, and was last updated by Peter Stoev 11 years, 1 month ago.
Viewing 2 posts - 1 through 2 (of 2 total)
-
Author
-
hello there,
i tried to make simple CRUD basic PHP, but i doesn’t work, when i tried to get input a new data, its like update a top data, can somebody fix my code. heregrid_data.php
<?php #Include the connect.php file include('../../../konek34iqp.php'); // get data and store in a json array $query = "SELECT * FROM asset_jenis"; if (isset($_GET['insert'])) { // INSERT COMMAND $insert_query = "INSERT INTO <code>asset_jenis</code>(<code>no_kategory</code>, <code>Kategory</code>, <code>jns_kategory</code>) VALUES ('".$_GET['no_kategory']."','".$_GET['Kategory']."','".$_GET['jns_kategory']."')"; $result = mysql_query($insert_query) or die("SQL Error 1: " . mysql_error()); echo $result; } else if (isset($_GET['update'])) { // UPDATE COMMAND $update_query = "UPDATE <code>asset_jenis</code> SET <code>no_kategory</code>='".$_GET['no_kategory']."', <code>Kategory</code>='".$_GET['Kategory']."', <code>jns_kategory</code>='".$_GET['jns_kategory']."'"; $result = mysql_query($update_query) or die("SQL Error 1: " . mysql_error()); echo $result; } else if (isset($_GET['delete'])) { // DELETE COMMAND $delete_query = "DELETE FROM <code>asset_jenis</code> WHERE <code>no_kategory</code>='".$_GET['no_kategory']."'"; $result = mysql_query($delete_query) or die("SQL Error 1: " . mysql_error()); echo $result; } else { // SELECT COMMAND $result = mysql_query($query) or die("SQL Error 1: " . mysql_error()); while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) { $asset_jenis[] = array( 'no_kategory' => $row['no_kategory'], 'Kategory' => $row['Kategory'], 'jns_kategory' => $row['jns_kategory'] ); } echo json_encode($asset_jenis); } ?>view.php
<!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../../scripts/jquery-1.10.2.min.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxdata.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxbuttons.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxscrollbar.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxdatatable.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxcheckbox.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxdata.export.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxlistbox.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxdropdownlist.js"></script> <script type="text/javascript" src="../../../jqwidgets/generatedata.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxpanel.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxradiobutton.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxtooltip.js"></script> <script type="text/javascript" src="../../../jqwidgets/jqxinput.js"></script> <script type="text/javascript" src="../../../scripts/demos.js"></script> <script type="text/javascript"> $(document).ready(function () { var source = { datatype: "json", cache: false, datafields: [ { name: 'no_kategory'}, { name: 'Kategory'}, { name: 'jns_kategory'}, ], id: 'no_kategory', url: 'grid_data.php', cache: false, addrow: function (rowid, rowdata, position, commit) { // synchronize with the server - send insert command var data = "insert=true&" + $.param(rowdata); $.ajax({ dataType: 'json', url: 'grid_data.php', data: data, cache: false, success: function (data, status, xhr) { // insert command is executed. commit(true); }, error: function(jqXHR, textStatus, errorThrown) { commit(false); } }); }, deleterow: function (rowid, commit) { // synchronize with the server - send delete command var data = "delete=true&" + $.param({EmployeeID: rowid}); $.ajax({ dataType: 'json', url: 'grid_data.php', cache: false, data: data, success: function (data, status, xhr) { // delete command is executed. commit(true); }, error: function(jqXHR, textStatus, errorThrown) { commit(false); } }); }, updaterow: function (rowid, rowdata, commit) { // synchronize with the server - send update command var data = "update=true&" + $.param(rowdata); $.ajax({ dataType: 'json', url: 'grid_data.php', cache: false, data: data, success: function (data, status, xhr) { // update command is executed. commit(true); }, error: function(jqXHR, textStatus, errorThrown) { commit(false); } }); }, updateRow: function (rowID, rowData, commit) { // synchronize with the server - send update command // call commit with parameter true if the synchronization with the server is successful // and with parameter false if the synchronization failed. commit(true); }, 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. commit(true); } }; var dataAdapter = new $.jqx.dataAdapter(source); $("#table").jqxDataTable( { width: 670, source: dataAdapter, height: 350, pageable: true, editable: true, showToolbar: true, altrows: true, ready: function() { // called when the DataTable is loaded. }, pagerButtonsCount: 8, toolbarHeight: 35, renderToolbar: function(toolBar) { var toTheme = function (className) { if (theme == "") return className; return className + " " + className + "-" + theme; } // appends buttons to the status bar. var container = $("<div style='overflow: hidden; position: relative; height: 100%; width: 100%;'></div>"); var buttonTemplate = "<div style='float: left; padding: 3px; margin: 2px;'><div style='margin: 4px; width: 16px; height: 16px;'></div></div>"; var addButton = $(buttonTemplate); var editButton = $(buttonTemplate); var deleteButton = $(buttonTemplate); var cancelButton = $(buttonTemplate); var updateButton = $(buttonTemplate); container.append(addButton); container.append(editButton); container.append(deleteButton); container.append(cancelButton); container.append(updateButton); toolBar.append(container); addButton.jqxButton({cursor: "pointer", enableDefault: false, height: 25, width: 25 }); addButton.find('div:first').addClass(toTheme('jqx-icon-plus')); addButton.jqxTooltip({ position: 'bottom', content: "Add"}); editButton.jqxButton({ cursor: "pointer", disabled: true, enableDefault: false, height: 25, width: 25 }); editButton.find('div:first').addClass(toTheme('jqx-icon-edit')); editButton.jqxTooltip({ position: 'bottom', content: "Edit"}); deleteButton.jqxButton({ cursor: "pointer", disabled: true, enableDefault: false, height: 25, width: 25 }); deleteButton.find('div:first').addClass(toTheme('jqx-icon-delete')); deleteButton.jqxTooltip({ position: 'bottom', content: "Delete"}); updateButton.jqxButton({ cursor: "pointer", disabled: true, enableDefault: false, height: 25, width: 25 }); updateButton.find('div:first').addClass(toTheme('jqx-icon-save')); updateButton.jqxTooltip({ position: 'bottom', content: "Save Changes"}); cancelButton.jqxButton({ cursor: "pointer", disabled: true, enableDefault: false, height: 25, width: 25 }); cancelButton.find('div:first').addClass(toTheme('jqx-icon-cancel')); cancelButton.jqxTooltip({ position: 'bottom', content: "Cancel"}); var updateButtons = function (action) { switch (action) { case "Select": addButton.jqxButton({ disabled: false }); deleteButton.jqxButton({ disabled: false }); editButton.jqxButton({ disabled: false }); cancelButton.jqxButton({ disabled: true }); updateButton.jqxButton({ disabled: true }); break; case "Unselect": addButton.jqxButton({ disabled: false }); deleteButton.jqxButton({ disabled: true }); editButton.jqxButton({ disabled: true }); cancelButton.jqxButton({ disabled: true }); updateButton.jqxButton({ disabled: true }); break; case "Edit": addButton.jqxButton({ disabled: true }); deleteButton.jqxButton({ disabled: true }); editButton.jqxButton({ disabled: true }); cancelButton.jqxButton({ disabled: false }); updateButton.jqxButton({ disabled: false }); break; case "End Edit": addButton.jqxButton({ disabled: false }); deleteButton.jqxButton({ disabled: false }); editButton.jqxButton({ disabled: false }); cancelButton.jqxButton({ disabled: true }); updateButton.jqxButton({ disabled: true }); break; } } var rowIndex = null; $("#table").on('rowSelect', function (event) { var args = event.args; rowIndex = args.index; updateButtons('Select'); }); $("#table").on('rowUnselect', function (event) { updateButtons('Unselect'); }); $("#table").on('rowEndEdit', function (event) { updateButtons('End Edit'); }); $("#table").on('rowBeginEdit', function (event) { updateButtons('Edit'); }); addButton.click(function (event) { if (!addButton.jqxButton('disabled')) { // add new empty row. $("#table").jqxDataTable('addRow', null, {}, 'first'); // select the first row and clear the selection. $("#table").jqxDataTable('clearSelection'); $("#table").jqxDataTable('selectRow', 0); // edit the new row. $("#table").jqxDataTable('beginRowEdit', 0); updateButtons('add'); } }); cancelButton.click(function (event) { if (!cancelButton.jqxButton('disabled')) { // cancel changes. $("#table").jqxDataTable('endRowEdit', rowIndex, true); } }); updateButton.click(function (event) { if (!updateButton.jqxButton('disabled')) { // save changes. $("#table").jqxDataTable('endRowEdit', rowIndex, false); } }); editButton.click(function () { if (!editButton.jqxButton('disabled')) { $("#table").jqxDataTable('beginRowEdit', rowIndex); updateButtons('edit'); } }); deleteButton.click(function () { if (!deleteButton.jqxButton('disabled')) { $("#table").jqxDataTable('deleteRow', rowIndex); updateButtons('delete'); } }); }, columns: [ { text: 'no_kategory', editable: false, dataField: 'no_kategory', width: 100 }, { text: 'Kategory', dataField: 'Kategory', cellsFormat: 'f', cellsAlign: 'right', align: 'right', width: 100}, { text: 'jns_kategory', dataField: 'jns_kategory', cellsAlign: 'right', align: 'right', cellsFormat: 'd'} ] }); }); </script> </head> <body class='default'> <div id="table"></div> </body> </html>Hi sigit,
We would not be able to test your scenario, because the CRUD in your case are bound to your DB Table which we do not have. However, a big problem which I see in your code is that you defined updaterow and deleterow 2 times. It is also possible that your DB has some FK relations and the update may not be so simple on your side.
Best Regards,
Peter StoevjQWidgets Team
http://www.jqwidgets.com/ -
AuthorPosts
Viewing 2 posts - 1 through 2 (of 2 total)
You must be logged in to reply to this topic.