Подтвердить что ты не робот

Jqgrid reload grid после успешного встроенного обновления/встроенного создания записи

Мне интересно, как я могу вызвать reloadGrid после встроенного редактирования строки.

<script type="text/javascript">

    jQuery(document).ready(function(){
      var lastcell; 
      jQuery("#grid").jqGrid({
          url:'{{ json_data_handler }}?year={{ get_param_year }}&month={{ get_param_month }}&project_id={{ get_param_project_id }}',
          datatype: "json",
          mtype: 'GET',
          colNames:['hour_record_pk', 'project_pk', 'weekday', 'date', 'sum', 'description'],
          colModel:[
                    {name:'hour_record_pk',index:'hour_record_pk', width:55, sortable:false, editable:true, editoptions:{readonly:true,size:10}},
                    {name:'project_pk',index:'project_pk', width:55, sortable:false, editable:true, editoptions:{readonly:true,size:10}},
                    {name:'weekday',index:'weekday', width:300, editable:false, sortable:false},
                    {name:'date_str',index:'date_str', width:300, editable:true, sortable:false, editoptions:{readonly:true}},
                    {name:'sum',index:'sum', width:100, editable:true, sortable:true,editrules:{number:true,minValue:0,maxValue:24,required:true}},
                    {name:'description',index:'description', width:600, editable:true, sortable:false,},
               ],
         jsonReader : {
              repeatitems:false
         },
          rowNum:31,
          rowList:[10,20,31],
          //pager: jQuery('#gridpager'),
          sortname: 'id',
          viewrecords: true,
          sortorder: "asc",
          width: 800,
          height: 750,
          caption:"Hour Record Overview",
          reloadAfterEdit: true, //seems to have no effect
          reloadAfterSubmit: true, //seems to have no effect
          onSelectRow: function(id){    
                if(id && id!==lastcell){
                    jQuery('#grid').jqGrid('restoreRow',lastcell);
                    jQuery('#grid').jqGrid('editRow',id,true);
                    lastcell=id;
                    }
                }, 
          editurl:"{% url set_hour_record_json_set %}"
     }).navGrid('#gridpager');
    });

function reload(result) {
    $("#grid").trigger("reloadGrid"); 
    } 

Я создал уже метод перезагрузки, но я не уверен, куда его вставить. Я пробовал:

jQuery('#grid').jqGrid('editRow',id,true,reload());

но это уже вызвано, когда пользователь щелкает по строке. Приведенный выше код позволяет пользователю щелкнуть по строке и при нажатии введите данные, и запись будет обновлена ​​или создана.

После того как пользователь создал новый объект, мне нужно перезагрузить сетку, так как мне нужен идентификатор объекта вновь созданного объекта, чтобы позаботиться о дальнейшем редактировании этой строки.

Изменить: Решение:

onSelectRow: function(row_id){
             if(row_id != null) {
                if(row_id !== last_selected_row) {
                    jQuery('#grid').jqGrid('restoreRow',last_selected_row);
                    jQuery('#grid').jqGrid('saveRow',row_id)
                           .editRow(row_id, true,false,reload);
                    last_selected_row = row_id; 
                } else {
                    last_selected_row=row_id;
                }
              }
            },  

Обновление: для справок в будущем. Все пользователи, начинающие с js-сеток, также могут посмотреть Slickgrid, поскольку я переключился с jqgrid на slickgrid и могу только рекомендовать его.

4b9b3361

Ответ 1

Вот синтаксис функции editRow

jQuery("#grid_id").jqGrid('editRow', rowid, keys, oneditfunc, succesfunc, url, extraparam, aftersavefunc, errorfunc, afterrestorefunc);

oneditfunc: срабатывает после успешного завершения доступ к строке для редактирования, предшествующий для обеспечения доступа пользователя к вводу поля. Идентификатор строки передается как параметр этой функции.

succesfunc: если определено, эта функция вызывается сразу после запрос успешный. Эта функция передаются данные, возвращенные из сервер. В зависимости от данных из сервер; эта функция должна вернуться true или false.

aftersavefunc: если определено, это функция вызывается после того, как данные сохранен на сервере. Прошедшие параметры к этой функции относятся rowid и ответ от запроса сервера.

В вашем случае, если вы хотите перезагрузить сетку после сохранения строки, вызов метода editRow должен выглядеть следующим образом.

jQuery('#grid').jqGrid("editRow", id, true, '', '', '', '', reload)

Я назначил вашу перезагрузку функцию, которая перезагружает сетку для параметра aftersavefunc

сам метод перезагрузки должен быть определен следующим образом

function reload(rowid, result) {
  $("#grid").trigger("reloadGrid"); 
}

Ответ 2

Попробуйте это

      $("#grid").jqGrid('editRow', rowid, true, null, null, null, {}, aftersavefunc);

//

        function aftersavefunc(rowid, result) {
        $("#grid").trigger("reloadGrid");
    }


//

Ответ 3

Посмотрите на метод saveRow:

saveRow (rowid, succesfunc, url, extraparam, aftersavefunc, onerrorfunc)

который определяет два обратных вызова (successfuncs, aftersavefunc), которые должны быть вызваны, когда запрос завершен успешно и после того, как данные были сохранены соответственно.

Ответ 4

В документах я думаю, что afterSaveCell будет работать лучше всего для вас (afterSubmitCell может работать, но, похоже, для него требуется определенное возвращаемое значение. afterEditCell происходит до того, как произойдет сбой сервера, так что будет слишком рано).

jQuery('#grid').jqGrid('editRow', id, true, reload);

jQuery(document).ready(function(){
    var lastcell; 
   jQuery("#grid").jqGrid({

      // [snip earlier config]

      onSelectRow: function(id){    
            if(id && id!==lastcell){
                jQuery('#grid').jqGrid('restoreRow',lastcell);
                jQuery('#grid').jqGrid('editRow',id,true);
                lastcell=id;
                }
            }, 
      editurl:"{% url set_hour_record_json_set %}",
      onAfterSaveCell: reload
   }).navGrid('#gridpager');
});

function reload(result) {
    $("#grid").trigger("reloadGrid"); 
} 

Однако перезагрузка всей сетки, вероятно, будет чрезмерной, учитывая информацию, которую вы описали до сих пор. Если на стороне сервера не обрабатывается поданная информация (это означает, что данные в db могут отличаться после сохранения), перезагрузка после простого редактирования кажется мне пустой тратой времени.

Что касается того, когда вы создаете новую строку, опять же, если только не происходит перехват данных на стороне сервера, похоже, было бы проще просто получить новый идентификатор из submit, а затем внести это индивидуальное изменение в jqGrid. Однако, в конце концов, это зависит от того, сколько времени потребуется для перезагрузки всей таблицы.

Ответ 5

Ок, теперь решение для копирования-вставки, которое работает хотя бы для меня

 onSelectRow: function(id){
    $('#grid').jqGrid("editRow", id, true, '', '', '', '', reloadTable);
 },
 // more confir

 // reload table after submit. Put it somewhere in your JS file
  function reloadTable(result) {
    $('#grid').trigger("reloadGrid");
  }