JqGrid, как я могу форматировать сообщения об ошибках при использовании navGrid

Question

jqGrid 4.13.6-pre - free jqGrid 

Я использую navGrid и встроенное редактирование, и у меня возникают проблемы с сообщениями подтверждения форматирования, отправленными с сервера. Сообщения проверки корректны, когда они возвращаются из встроенного редактирования, но они не выглядят хорошо, когда в форме «Добавить/редактировать», доступ к которой осуществляется из навигации по сетке.

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

$(function() { 
     var lastSel = 0; 

     $("#Grid") 
      .jqGrid({ 
       url: '/url/to/griddata', 
       datatype: 'json', 
       mtype: 'POST', 
       colNames: ['Id', 'Name'], 
       colModel: [ 
        { name: 'Id', hidden: false, search: true, width: 150, align: 'center', sortable: true, editable: false, formatter: null, edittype: 'text' }, 
        { name: 'Name', hidden: false, search: true, width: 150, align: 'center', sortable: true, editable: true, formatter: null, edittype: 'text', editoptions: { maxlength: 256, value: null, required: true } }], 
       pager: '#GridPager', 
       prmNames: { 
        page: 'PageNumber', 
        rows: 'PageSize', 
        sort: 'SortColumn', 
        order: 'SortOrder', 
        search: 'Search', 
        nd: 'nd', 
        npage: 'null' 
       }, 
       rowNum: 60, 
       rowList: [ 
        15, 
        30, 
        60, 
        120 
       ], 
       sortname: "Name", 
       sortorder: "asc", 
       viewrecords: true, 
       hidegrid: false, 
       gridview: true, 
       caption: '', 
       width: 980, 
       height: 100, 
       editurl: '/my/edit/url', 
       edit: { 
        errorTextFormat: function (data) { 
         alert('fired'); 
         console.log(data); 
         return "error here"; 
        } 
       }, 
       jsonReader: { 
        total: 'TotalPages', 
        page: 'CurrentPage', 
        records: 'TotalRecords', 
        root: 'Rows', 
        id: 'Id', 
        repeatitems: false 
       }, 
       onSelectRow: function(id) { 
        if (id && id !== lastSel) { 
         jQuery('#Grid').restoreRow(lastSel); 
         lastSel = id; 
        } 
        $('#Grid').jqGrid('editRow', id, 
        { 
         keys: true 
        }); 
       } 
      }); 

     $("#Grid").filterToolbar({ autosearch: true, searchOnEnter: false }); 
     $("#Grid").navGrid('#GridPager', { 
      del: false, search: false, editerrorTextFormat: function (data) { 
       alert('fired'); 
       console.log(data); 
       return "error here"; 
      } 
     }); 

Вот разметка.

Answer 1

Там нет edit варианта jqGrid и не editerrorTextFormat собственности navGrid. Легко исправить код, используя параметры formEditing, что позволяет указать значения по умолчанию editGridRow метод, используемый прямо или косвенно в сетке. Вам нужно просто переименовать edit в formEditing, и ваш код должен работать. Важно только то, что сервер должен использовать код ошибки HTTP-ошибки в случае сообщения об ошибке (например, 400 или выше). Код ошибки 500 или выше кажется мне лучшим выбором в вашем случае.

Точно так же вы можете указать опции filterToolbar или Диалог поиска внутри searching вариант бесплатного jqGrid. Вы можете указать параметры по умолчанию navGrid внутри опции navOptions опции jqGrid.

Я бы порекомендовал вам дополнительно использовать параметр jqGrid вместо lastSel. Параметр будет заполнен jqGrid при запуске встроенного редактирования или редактирования ячейки. Если содержит массив доступных для редактирования значений до модификаций и id имущество дополнительно. Потому что вы кал

Я рекомендую вам дополнительно использовать pager: true вместо pager: '#GridPager' и просто пропустить '#GridPager' параметр navGrid или inlineNav. Бесплатный jqGrid автоматически сгенерирует <div> для пейджера, он назначит уникальный идентификатор div, и он изменит параметр pager: true на '#generatesIdValueOfTheDiv'. Вы будете немного короче и легче читать и поддерживать.

Окончательный код может выглядеть следующим образом

$(function() { 
    $("#Grid") 
     .jqGrid({ 
      url: '/url/to/griddata', 
      datatype: 'json', 
      mtype: 'POST', 
      colModel: [ 
       { name: 'Id', align: 'center' }, 
       { name: 'Name', align: 'center', editable: true, 
        editoptions: { maxlength: 256, required: true } } 
      ], 
      pager: true, 
      prmNames: { 
       page: 'PageNumber', 
       rows: 'PageSize', 
       sort: 'SortColumn', 
       order: 'SortOrder', 
       search: 'Search' 
      }, 
      rowNum: 60, 
      rowList: [ 
       15, 
       30, 
       60, 
       120 
      ], 
      sortname: "Name", 
      viewrecords: true, 
      hidegrid: false, 
      width: 980, 
      height: 100, 
      editurl: '/my/edit/url', 
      jsonReader: { 
       total: 'TotalPages', 
       page: 'CurrentPage', 
       records: 'TotalRecords', 
       root: 'Rows', 
       id: 'Id', 
       repeatitems: false 
      }, 
      formEditing: { 
       closeOnEscape: true, 
       closeAfterEdit: true, 
       savekey: [true, 13], 
       errorTextFormat: function (data) { 
        alert('fired'); 
        console.log(data); 
        return "error here"; 
       } 
      }, 
      inlineEditing: { 
       keys: true 
      }, 
      searching: { 
       searchOnEnter: false 
      }, 
      navOptions: { 
       del: false, 
       search: false 
      }, 
      onSelectRow: function (rowid) { 
       var $self = $(this), i, 
        // savedRows array is not empty if some row is in inline editing mode 
        savedRows = $self.jqGrid("getGridParam", "savedRow"); 

       for (i = 0; i < savedRows.length; i++) { 
        if (savedRows[i].id !== rowid) { 
         // cancel editing of not saved rows 
         $self.jqGrid("restoreRow", savedRows[i].id); 
        } 
       } 

       $self.jqGrid("editRow", rowid); 
      } 
     }) 
     .jqGrid("filterToolbar"); 
     .jqGrid("navGrid"); 
}); 

(я добавил еще несколько свойств в formEditing, что один часто используется. Вы можете удалить ненужные свойства). Я удалил несколько ненужных опций и некоторые ненужные свойства colModel, потому что вы указали значения по умолчанию.