2015-05-28 3 views
6

У меня есть следующий код, чтобы войти в встроенное редактирование по двойному щелчку:Reload jqGrid на сохранение/отправить

ondblClickRow: function (row_id) { 
      if(row_id != null) { 
        $('#Products').jqGrid('restoreRow',last_selected_row); 
        $('#Products').jqGrid('saveRow',row_id); 
        $("#Products").jqGrid('editRow',row_id, true, null, 
         function(){ $("#Products").trigger("reloadGrid", [{current: true}]); }, 
         'xtras/Products.php', 
         null,{}, 
         {},{} 
        ); 
        $("#Products_ilsave").removeClass('ui-state-disabled'); 
        $("#Products_ilcancel").removeClass('ui-state-disabled'); 
        $("#Products_ilcancel").removeClass('ui-state-disabled'); 
        $("#Products_ilcopy").addClass('ui-state-disabled'); 
        $("#Products_iladd").addClass('ui-state-disabled'); 
      } 
     } 

и навигация определения:

$("#Products").jqGrid("navGrid", "#Products_pager", 
      {search: true, add: false, edit: false, del: true, refreshstate: "current"}, 
      {}, 
      {}, 
      {}, 
      {}, 
      {sopt:['eq','ne','cn','bw','bn','ge','le','lt','gt'], multipleSearch:true, showQuery: false} 
     ) 
    .jqGrid("inlineNav", "#Products_pager", 
     {add: true, edit: true}, 
    ) 
    .navButtonAdd('#Products_pager',{ 
     caption:"", 
     title:"Copy selected row", 
     id:"Products_ilcopy", 
     buttonicon:"ui-icon-copy", 
     onClickButton: function(){ 
      var srcrowid = $grid.jqGrid('getGridParam', 'selrow'); 

      if (srcrowid > 0) { 
       $('#Products_iladd').click(); 
       var rowData = $('#Products').jqGrid('getRowData', srcrowid); 
       rowData.ID = ''; 
       rowData.Catalogue = ''; 
       rowData.UPCEAN = ''; 
       rowData.copyID = srcrowid; 
       $grid.jqGrid('setRowData', 'new_row', rowData); 
       var ondblClickRowHandler = $('#Products').jqGrid("getGridParam", "ondblClickRow"); 
       ondblClickRowHandler.call($("#Products")[0], 'new_row'); 
      } else { 
       alert('Please select a row to copy'); 
       return false; 
      } 
     }, 
     position:"last" 
    }); 

Как вы можете видеть, когда я нажимаю на кнопку COPY новая строка создана и ondblClickRow вызывается для ввода встроенного редактирования. Если я нажму на кнопку SAVE в navGrid - он сохраняет, но не перезагружает. Если я нажму Enter, то он перезагрузится, но ничего не спасет.

Как сэкономить и перезагрузить сетку после того, как понравится?

-------------- UPDATE ---------------------

добавить, редактировать, удалять, копия - все тот же URL - 'Xtras/products.php'

url:'xtras/Products.php', 
editurl:'xtras/Products.php', 
datatype: "json", 
mtype:'GET', 

$ ('#') Продукты - это единственная сетка на странице

использованием - jqGrid 4.4.2

+0

Важно знать следующее во всех вопросах jqGrid: какой тип данных вы используете? Вам нужно перезагрузить данные локально с сервера? Какой 'editurl' вы используете? Вы редактируете и сохраняете данные локально или на сервере? Ir '$ ('# Products')' той же сетке или другой? Какую версию jqGrid и какую вилку jqGrid (старый jqGrid, бесплатный jqGrid, Guriddo jqGrid JS) вы используете? – Oleg

+0

@Oleg Привет, извините, конечно ... я обновил сообщение .... – Elen

ответ

4

Основные проблемы в вашем текущем коде следующие: вы указываете обратный вызов с reloadGridтолько для одного прямого звонка из editRow. С другой стороны вы используете inlineNav, у которых есть два других звонка editRow: один нажимает кнопку «Изменить», а другой - на кнопку «Добавить». У вас не будет перезагрузки сетки в корпусе. Существуют и другие проблемы при реализации кнопки «Копировать выбранную строку». Поэтому я решил переписать код, который вы используете. Полученный код может выглядит, как показано ниже

var editOptions = { 
     keys: true, 
     aftersavefunc: function() { 
      var $self = $(this); 
      setTimeout(function() { 
       $self.trigger("reloadGrid", [{current: true}]); 
      }, 50); 
     }, 
     url: "xtras/Products.php" 
    }, 
    gridIdSelector = "#Products", 
    pagerIdSelector = "#Products_pager", 
    $grid = $(gridIdSelector); 

$.extend($.jgrid.search, { 
    sopt: ["eq", "ne", "cn", "bw", "bn", "ge", "le", "lt", "gt"], 
    multipleSearch: true 
}); 

// create the grid 
$grid.jqGrid({ 
    ... 
    pager: pagerIdSelector, 
    ondblClickRow: function (rowid) { 
     var $self = $(this), 
      savedRows = $self.jqGrid("getGridParam", "savedRow"); 

     if (savedRows.length > 0 && savedRows[0].id !== rowid) { 
      // cancel editing of another row is editing 
      // don't cancel on double click on the current editing 
      $self.jqGrid("restoreRow", savedRows[0].id); 
     } 
     if (savedRows.length === 0) { 
      $self.jqGrid("editRow", rowid, editOptions); 
     } 
    } 
}) 
.jqGrid("navGrid", pagerIdSelector, {add: false, edit: false, refreshstate: "current"}) 
.jqGrid("inlineNav", pagerIdSelector, { editParams: editOptions, addParams: {addRowParams: editOptions}}) 
.jqGrid("navButtonAdd", pagerIdSelector, { 
    caption: "", 
    title: "Copy selected row", 
    id: $grid[0].id + "_ilcopy", 
    buttonicon: "ui-icon-copy", 
    onClickButton: function() { 
     var $self = $(this), p = $self.jqGrid("getGridParam"), rowData, 
      srcrowid = p.selrow, savedRows = p.savedRow; 

     if (srcrowid !== null) { 
      if (savedRows.length > 0) { 
       // cancel editing 
       $self.jqGrid("restoreRow", savedRows[0].id); 
      } 
      rowData = $self.jqGrid("getRowData", srcrowid); 
      rowData.ID = ""; 
      rowData.Catalogue = ""; 
      rowData.UPCEAN = ""; 
      rowData.copyID = srcrowid; 
      $self.jqGrid("addRow", { 
       initdata: rowData, 
       addRowParams: editOptions 
      }); 
     } else { 
      alert("Please select a row to copy"); 
      return false; 
     } 
    } 
}); 

// Enable/disable buttons on start/end of editing 
$grid.bind("jqGridInlineEditRow jqGridInlineAfterSaveRow jqGridInlineAfterRestoreRow", function() { 
    var $self = $(this), 
     savedRows = $self.jqGrid("getGridParam", "savedRow"); 
    if (savedRows.length > 0) { 
     // some row is editing now 
     $(gridIdSelector + "_ilsave," + gridIdSelector + "_ilcancel").removeClass("ui-state-disabled"); 
     $(gridIdSelector + "_ilcopy," + gridIdSelector + "_iladd," + gridIdSelector + "_iledit").addClass("ui-state-disabled"); 
    } else { 
     // No row is editing now 
     $(gridIdSelector + "_ilsave," + gridIdSelector + "_ilcancel").addClass("ui-state-disabled"); 
     $(gridIdSelector + "_ilcopy," + gridIdSelector + "_iladd," + gridIdSelector + "_iledit").removeClass("ui-state-disabled"); 
    } 
}); 

Вы можете видеть, что я определяет один объектeditOptions который я использую позже в качестве вариантов editRow для всех случаев. Кроме того, я использую параметр jqGrid savedRow, который содержит информацию о редактируемых в настоящее время (с учетом строк или строк). Если savedRow - пустой массив, то теперь строки не редактируются. Если он не пуст, то свойство id элементов массива содержит rowid строки редактирования. Я использую дополнительно прямой вызов метода addRow внутри обработчика onClick кнопки «Копировать выбранную строку».

+0

Привет, Олег, я понял ваше объяснение и код - я вижу о прямом вызове 'addRow' в Copy и почему вы используете' editOptions' объект. Я не знал, что есть параметр 'savedRow', поэтому это очень помогает. Я попробую ваш код позже и дам вам знать. – Elen

+0

@Elen: Хорошо. Добро пожаловать! – Oleg

+0

Вы код работает почти так, как ожидалось .. но кнопка «Сохранить» всегда отключена .... потому что она разрешена только на 'savedRows.length> 0' - которая вызывается после' save' ... и BTW, которую вы пропускаете запятая после 'initdata: rowData' – Elen

Смежные вопросы