Databases
StackOverflow2013
Postsdbo
POjqgrid edit call ajax every time
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjqgrid edit call ajax every time
    primarykey
    data
    text
    <p>I'm trying to use jqgrid edit form, but I can't understand why jqgrid do not call asmx web method every time I select a row and I click on edit icon (jqgrid call ajax just the first time)</p> <p>This is the code:</p> <pre><code>function Grid() { var ret = Array(); var grid = jQuery("#grid"); var hideLoading = function () { $("#lui_" + grid).hide(); $("#load_" + grid).hide(); } var strSearch = ""; var strField = ""; var strOper = ""; // // handler: si occupa di creare il contenuto del menu a tendina (form jqGrid) // var buildOptions = function (dataList) { var response = dataList; var option = ""; if (response &amp;&amp; response.length) { for (var i = 0, l = response.length; i &lt; l; i++) { if (response[i]["selectedvalue"] == "on") option += '&lt;option role="option" selected="selected" value="' + response[i]["Codice"] + '"&gt;' + response[i]["Descrizione"] + '&lt;/option&gt;'; else option += '&lt;option role="option" value="' + response[i]["Codice"] + '"&gt;' + response[i]["Descrizione"] + '&lt;/option&gt;'; } } return option; }; grid.jqGrid({ // setup custom parameter names to pass to server prmNames: { search: "isSearch", nd: null, rows: "numRows", page: "page", sort: "sortField", order: "sortOrder" }, // add by default to avoid webmethod parameter conflicts postData: { searchString: '', searchField: '', searchOper: '' }, // setup ajax call to webmethod datatype: function (postdata) { $.ajax({ url: '&lt;%# ResolveUrl("~/Service/Domain/ServiceRoom.asmx/GetRoomRateDiscount") %&gt;', type: "POST", contentType: "application/json; charset=utf-8", data: JSON.stringify(postdata), dataType: "json", success: function (data, st) { if (data.d == "KO") { grid.GridUnload(); jAlert("La ricerca non ha restituito alcun risultato", "Book2Guest"); return false; } if (st == "success") { var grid = $("#grid")[0]; grid.addJSONData(JSON.parse(data.d)); ret = JSON.parse(data.d); } }, error: function (xhr, textStatus, errorThrown) { jAlert("Si è verificato un errore: " + textStatus + " " + errorThrown + " -- " + $.parseJSON(xhr.statusText), "Book2Guest"); } }); }, // this is what jqGrid is looking for in json callback jsonReader: { root: "rows", page: "page", total: "totalpages", records: "totalrecords", cell: "cell", id: "id", userdata: "userdata", repeatitems: true }, ajaxSelectOptions: { contentType: "application/json; charset=utf-8", dataType: "json", cache: false, data: { rowId: function () { if (JSON.stringify(grid.jqGrid('getRowData', grid.jqGrid('getGridParam', 'selrow'))['Codice']) == undefined) return ""; return JSON.stringify(grid.jqGrid('getRowData', grid.jqGrid('getGridParam', 'selrow'))['Codice']); } } }, colNames: ['ID', 'Rate'], colModel: [ { name: 'ID', index: 'ID', width: 10, align: "center", search: false, sorttype: 'int', searchoptions: { sopt: ['eq', 'ne', 'cn']} }, { name: 'TariffaCodiceOfferta', index: 'TariffaCodiceOfferta', width: 50, hidden: true, formatter: 'select', editable: true, edittype: 'select', editrules: { edithidden: true }, //, required: true }, editoptions: { multiselect: true, dataUrl: '&lt;%# ResolveUrl("~/Service/Domain/ServiceRoom.asmx/GetRoomRateListByRowId") %&gt;', buildSelect: function (data) { var response = $.parseJSON(data.d); var option = buildOptions(response); var s = '&lt;select&gt;'; s += option; return s + "&lt;/select&gt;"; }, dataInit: function (elem) { setTimeout(function () { $(elem).multiselect({ selectedList: 10 }); }, 50); }, multiple: true } }, ], rowNum: 10, rowList: [10, 20, 30], height: 'auto', pager: '#gridpager', viewrecords: true, shrinkToFit: false, loadComplete: function () { hideLoading(); }, loadError: function () { hideLoading(); }, editurl: '&lt;%# ResolveUrl("~/Service/Domain/ServiceRoom.asmx/SaveRoomDiscount") %&gt;', sortname: "ID", sortorder: "asc", caption: "Rate list", onSelectRow: function (id, status) {}, ondblClickRow: function (rowid) { grid.jqGrid('editGridRow', rowid, { width: 450, height: 450, closeOnEscape: true, addCaption: "Add Rate", editCaption: "Edit Rate", bSubmit: "Salva", bCancel: "Annulla", bClose: "Chiudi", bYes: "Si", bNo: "No", bExit: "Annulla", editData: { "codice": function () { var selectedRow = grid.getGridParam("selrow"); var rowData = grid.getRowData(selectedRow); return rowData["Codice"]; } }, viewPagerButtons: false, closeAfterEdit: true, reloadAfterSubmit: true, beforeShowForm: function (form) { var dlgDiv = $("#editmod" + grid[0].id); var parentDiv = dlgDiv.parent(); // div#gbox_list var dlgWidth = dlgDiv.width(); var parentWidth = parentDiv.width(); var dlgHeight = dlgDiv.height(); var parentHeight = parentDiv.height(); // Grabbed jQuery for grabbing offsets from here: //http://stackoverflow.com/questions/3170902/select-text-and-then-calculate-its-distance-from-top-with-javascript var parentTop = parentDiv.offset().top; var parentLeft = parentDiv.offset().left; dlgDiv[0].style.top = Math.round(parentTop + (parentHeight - dlgHeight) / 2) + "px"; dlgDiv[0].style.left = Math.round(parentLeft + (parentWidth - dlgWidth) / 2) + "px"; }, onClose: function (response, postdata) { } }); return; }, gridComplete: function () { if (grid.getGridParam('records') == 0) // are there any records? DisplayEmptyText(true); else DisplayEmptyText(false); }, emptyDataText: 'There are no records. ' }) grid.setGridWidth(900, true); grid.jqGrid('navGrid', '#gridpager', { edit: true, view: false, add: false, del: true, search: false }, //prmEdit { width: 450, height: 300, closeOnEscape: true, addCaption: "Aggiungi Offerta", editCaption: "Modifica Offerta", bSubmit: "Salva", bCancel: "Annulla", bClose: "Chiudi", saveData: "Sono state apportate delle modifiche, sei sicuro di voler continuare?", bYes: "Si", bNo: "No", bExit: "Annulla", editData: { "Codice": function () { var selectedRow = grid.getGridParam("selrow"); var rowData = grid.getRowData(selectedRow); return rowData["Codice"]; } }, viewPagerButtons: false, closeAfterEdit: true, reloadAfterSubmit: true, beforeShowForm: function (form) { var dlgDiv = $("#editmod" + grid[0].id); var parentDiv = dlgDiv.parent(); // div#gbox_list var dlgWidth = dlgDiv.width(); var parentWidth = parentDiv.width(); var dlgHeight = dlgDiv.height(); var parentHeight = parentDiv.height(); // Grabbed jQuery for grabbing offsets from here: //http://stackoverflow.com/questions/3170902/select-text-and-then-calculate-its-distance-from-top-with-javascript var parentTop = parentDiv.offset().top; var parentLeft = parentDiv.offset().left; dlgDiv[0].style.top = Math.round(parentTop + (parentHeight - dlgHeight) / 2) + "px"; dlgDiv[0].style.left = Math.round(parentLeft + (parentWidth - dlgWidth) / 2) + "px"; }, onClose: function (response, postdata) {} } //prmSearch, //prmView ); return ret; </code></pre> <p>}</p> <p><strong>UPDATE</strong>: to solve this issue, you guys have to insert 'recreateForm: true' in the edit section of jqGrid</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PTQuestion
    1. USfrabiacca
    1. USfrabiacca
    plurals
    1. PL
      singulars
      1. LTLinked
    2. PL
      singulars
      1. LTLinked
    3. PL
      singulars
      1. LTLinked
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POjqgrid edit call ajax every time
      1. This table or related slice is empty.
      1. VTUpMod
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload