Блог

У меня есть jqgrid, которому нужно обновить данные о событии обмена, я создаю таблицу с помощью js и создаю объект jqgrid следующим образом:

 $('lt;table id="list2"gt;lt;/tablegt;'    'lt;div id="gridpager"gt;lt;/divgt;').appendTo('#topics'); grid = jQuery("#list2");  

после этого у меня есть функция ajax для получения данных из базы данных, и я помещаю jqgrid в метод успеха. вот код.

 function getReport(start_date,end_date) {  $.ajax({  url: "logics/inventory_reports",  type: "POST",  data: {  type: "getTrailBalance_report",  start_date: start_date,  end_date: end_date,  },  success: function (data) {  let dt = JSON.parse(data);  debugger;  grid.jqGrid({  datastr: dt.records,  datatype: "jsonstring",  height: "auto",  loadui: "disable",  pgbuttons : false,  pginput : false,  colNames: [/*"id",*/"Items","Debit", "Credit"],  colModel: [  //{name: "id",width:1, hidden:true, key:true},  {name: "name", width:250, resizable: false,sortable: false},  {name: "debit",width:150,sortable: false},  {name: "credit",width:150,sortable: false}  ],  treeGrid: true,  pager : '#gridpager',  caption: "Trail Balance Report",  ExpandColumn: "elementName",  autowidth: true,   rowNum: 10000,  jsonReader: {  root: "response"  }  }).navGrid('#gridpager',{  view:true,  del:false,  search: false,  autoRefresh: true,  });  jQuery("#list2").trigger("reloadGrid");   }  }); }  

а вот мой раскрывающийся список событий обмена.

 lt;select name="time_period" id="time_period" class="form-control" onchange="getTimePeriod()"gt;  lt;option value="0"gt;--Select Time Period--lt;/optiongt;  lt;option value="cDay"gt;Current Daylt;/optiongt;  lt;option value="lDay"gt;Last Daylt;/optiongt;  lt;option value="cWeek"gt;Current Weeklt;/optiongt;  lt;option value="lWeek"gt;Last Weeklt;/optiongt;  lt;option value="cMonth"gt;Current Monthlt;/optiongt;  lt;option value="lMonth"gt;Last Monthlt;/optiongt;  lt;option value="cYear"gt;Current Yearlt;/optiongt;  lt;option value="lYear"gt;Last Yearlt;/optiongt;  lt;/selectgt;  

вот код метода getTimePeriod (), из которого я вызываю метод GetReport с передающими параметрами.

функция getTimePeriod() {

 let timePeriod = $("#time_period").val();  let periodDate = new Date();  let date = new Date(), y = date.getFullYear(), m = date.getMonth();  let message = "";  let FYear;  let start_date = new Date();  debugger;  switch (timePeriod) {   case 'cDay':  periodDate = new Date();  message = 'Current Day';  break;   case 'lDay':  //periodDate = new Date;  start_date.setDate(start_date.getDate() - 1);  periodDate.setDate(periodDate.getDate() - 1);  // periodDate = periodDate.toISOString().slice(0, 10);  message = 'Last Day';  break;   case 'cWeek':  //periodDate = new Date;  start_date.setDate(start_date.getDate() - (start_date.getDay()   6) % 7); // Starting date of week  periodDate.setDate(periodDate.getDate() - (periodDate.getDay() - 7) % 7); // Ending date of Week  message = 'Current Week';  break;   case 'lWeek':  start_date.setDate(start_date.getDate() - (start_date.getDay()   6) % 7);// Starting date.  start_date.setDate(start_date.getDate() - 7);  periodDate.setDate(periodDate.getDate() - (periodDate.getDay() - 7) % 7); // Ending date.  periodDate.setDate(periodDate.getDate() - 7);  message = 'Last Week';  break;   case 'cMonth':  start_date = new Date(y, m, 1); // Starting date of this month.  periodDate = new Date(y, m   1, 0); // Ending date of this month.  message = 'Current Month';  break;   case 'lMonth':  start_date = new Date(y, m - 1, 1); // Starting date of the previous Month.  periodDate = new Date(y, m, 0); // Ending date of the previous Month.  message = 'Last Month';  break;   case 'cYear':  FYear = getFinancialYearsLastMonth();  start_date = new Date(y, FYear, 1); // Starting date of this Financial Year.  periodDate = new Date(y  1, FYear, 0); /*#### second value tells the month number ######*/ // Ending Date.  message = 'Current Year';  break;   case 'lYear':  FYear = getFinancialYearsLastMonth();  start_date = new Date(y - 1, FYear, 1); // Starting date of previous Financial Year.  periodDate = new Date(y, FYear, 0); /*#### second value tells the month number ######*/ // Ending Date  message = 'Last Year';  break;   }   // periodDate = periodDate.toISOString().slice(0, 10);  document.getElementById("showDate").innerHTML = getDateInFormat(periodDate);  getReport(ReFormateDate(start_date),ReFormateDate(periodDate));  }  

избегайте кода rest из метода getTimePeriod, просто посмотрите вызов GetReport.

Я ставлю отладчик и проверяю это каждый раз, когда данные обновляются, но jqgrid не обновляет данные. Я пробовал, но как jQuery(«#list2»).триггер(«Перезагрузка»); и .navGrid(«#gridpager»,{ просмотр:истина, del:ложь, поиск: ложь, автоответчик: истина,}); но безрезультатно. Не могли бы вы помочь мне с этим вопросом, пожалуйста? Спасибо!

В вашей реализации вы вызываете jqGrid (вашу функцию GetReport) каждый раз, когда вы делаете изменения — причина того, что сетка не обновляется, заключается в том, что она уже создана.

Когда создается экземпляр сетки, любой вызов к нему ничего не делает. Я вижу два простых решения

1. В вашем случае вы можете просто уничтожить сетку до ее создания — проверьте документы в зависимости от того, какая версия jqGrid используется — Guriddo jqGrid или free-jqGrid. — а затем вызовите экземпляр jqGrid.
2. Когда вы создаете сетку в первый раз, отметьте, что она создана, и после первого вызова функции успеха выполните (это просто не проверенный код).

 success: function (data) {  let dt = JSON.parse(data);  if (grid_is_created) {  grid.jqGrid('setGridParam',{ data: dt.records}).trigger("reloadGrid");  } else {  grid.jqGrid({...});  grid_is_created= true;  }