jqGrid (Удалить строку) — Как отправить дополнительные данные POST?

У меня проблема с механизмом удаления jqGrid, поскольку он отправляет только параметры «oper» и «id» в виде данных POST (id — это первичный ключ таблицы).

Проблема в том, что мне нужно удалить строку на основе идентификатора и другого значения столбца, скажем, user_id. Как добавить этот user_id в данные POST?

Я могу резюмировать проблему следующим образом:

  1. Как получить значение ячейки (user_id) выбранной строки?
  2. И как добавить этот user_id в данные POST, чтобы его можно было получить из кода, в котором происходит фактический процесс удаления.

Примеры кодов:

jQuery("#tags").jqGrid({
                url: "subgrid.process.php,
                editurl: "subgrid.process.php?,
                datatype: "json",
                mtype: "POST",
                colNames:['id','user_id','status_type_id'],
                colModel:[{name:'id', index:'id', width:100, editable:true},

                         {name:'user_id', index:'user_id', width:200, editable:true},

                        {name:'status_type_id', index:'status_type_id', width:200}
                ],
                pager: '#pagernav2',
                rowNum:10,
                rowList:[10,20,30,40,50,100],
                sortname: 'id',
                sortorder: "asc",
                caption: "Test",
                height: 200
        });
        jQuery("#tags").jqGrid('navGrid','#pagernav2',
            {add:true,edit:false,del:true,search:false},
        {},
             {mtype:"POST",closeAfterAdd:true,reloadAfterSubmit:true}, // add options
   {mtype:"POST",reloadAfterSubmit:true}, // del options
            {} // search options
        );

person ronanray    schedule 14.05.2010    source источник


Ответы (6)


Это не проблема. Есть разные способы сделать то, что вам нужно. Самый прямой способ — использование функции serializeDelData. Код jqGrid, который удаляет строки, выглядит следующим образом

var ajaxOptions = $.extend({
    url: rp_ge.url ? rp_ge.url : $($t).jqGrid('getGridParam','editurl'),
    type: p.mtype,
    data: $.isFunction(p.serializeDelData) ? p.serializeDelData(postd) : postd,
    complete:function(data,Status){
        //...
    },
    error:function(xhr,st,err){
        //...
    }
}, $.jgrid.ajaxOptions, p.ajaxDelOptions);

$.ajax(ajaxOptions);

Таким образом, вы можете просто определить свою собственную функцию serializeDelData, которая делает все, что вам нужно:

{mtype:"POST", reloadAfterSubmit:true, serializeDelData: function (postdata) {
      var rowdata = jQuery('#tags').getRowData(postdata.id);
      // append postdata with any information 
      return {id: postdata.id, oper: postdata.oper, user_id: rowdata.user_id};
 }}, // del options

Кстати, если вы хотите сами создавать данные, отправленные на сервер, просто верните строку вместо объекта. Затем данные будут размещены jQuery.ajax без каких-либо изменений.

Если вы предпочитаете размещать дополнительную информацию не в публикуемых данных, а в URL, вы можете сделать это внутри onclickSubmit. Например, я использую службу RESTfull на стороне сервера, а для удаления элемента использую HTTP-запрос DELETE с пустым телом. Все параметры размещаются в URL. Соответствующий код выглядит следующим образом:

{mtype:"DELETE", reloadAfterSubmit:true, serializeDelData: function (postdata) {
      return ""; // the body MUST be empty in DELETE HTTP requests
 }, onclickSubmit: function(rp_ge,postdata) {
      var rowdata = jQuery('#tags').getRowData(postdata.id);
       rp_ge.url = 'subgrid.process.php/' + encodeURIComponent(postdata.id) +
                   '?' + jQuery.param ({user_id: rowdata.user_id});
 }}, // del options
person Oleg    schedule 14.05.2010
comment
Спасибо. jQuery('#tags').getRowData(postdata.id); это как раз то, что я искал. - person Robert Claypool; 04.06.2010
comment
Я попробовал этот подход, помещая кнопку удаления в каждую строку моей сетки — он работал при первом нажатии кнопки «Удалить», но затем каждое последующее удаление продолжало использовать тот же URL-адрес, что и при первом нажатии. Я изменил код, чтобы избавиться от переопределения onclickSubmit, и вместо этого передал соответствующий URL-адрес непосредственно в метод delGridRow (вместо установки rp_ge.url), и это сработало. - person James Nail; 18.10.2010
comment
@ jrnail23: Вероятно, это зависит от использования опции recreateForm. У меня recreateForm:true по умолчанию. Можно попробовать добавить эту опцию вместе с mtype:"DELETE", reloadAfterSubmit:true, .... - person Oleg; 18.10.2010

Вот как я добрался до jqGrid, чтобы добавить больше данных в POST при удалении:

var grid = $("#grid").jqGrid(... //make your grid

$("#grid").jqGrid('navGrid', '#pager', {add:false, edit:false, del:true},
                  {},
                  {},
                  {delData: {
                             name: function() {
                                        var sel_id = grid.jqGrid('getGridParam', 'selrow');
                                        var value = grid.jqGrid('getCell', sel_id, 'colName');
                                        return value;
                                   }
                            }
                   },
                  {},
                  {});

Это вернет массив записей {id:rowNumber, oper:del, name:someValue}. name — это то, как вы хотите ссылаться на свою переменную в массиве сообщений, someValue — это то, что находится в интересующей вас ячейке из выбранной строки.

Надеюсь это поможет!

person ravl1084    schedule 05.09.2011

Этого легко добиться, если установить key:true в colModel следующим образом:

colModel: [ {name: 'childId', index: 'childId', align: 'center', sorttype: 'string', key:true},

это приведет к автоматической отправке этого поля во время POST.

Назначение key:true в colModel — просто позволить командному процессору правильно работать с индексированным набором записей.

person Power Engineering    schedule 13.05.2016
comment
Установив key: true , он отправляет значение только как _id. Вы не можете отправить с ним данные других полей. - person Sanjay Poongunran; 08.03.2018

У меня такая же проблема. То, как я это исправил, заключалось в том, чтобы поместить user_id в качестве первого столбца в моих jsondata. и с настройками jsonreader jqgrid вы можете сделать это, и это сработает.

http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data

посмотрите настройки jsonreader для jsondata.

я использую:

jsonReader: { cell: "", id: "0" }

а мои данные такие

{ totalpages: "xxx",  currpage: "yyy",  totalrecords: "zzz",
  invdata : [
   {"userid","cell12", "cell13", "cell14"},
   {"userid","cell22", "cell23", "cell24"},
    ...
   ]
}

и теперь, если я обновлю строку или удалю строку, я получу идентификатор пользователя. Надеюсь, это может сработать для вас!

person bruno    schedule 14.05.2010
comment
Извините, но проблема была не в получении данных, а в размещении дополнительной информации при удалении строки из jqGrid. Нужно иметь не один userid, а два id: id и user_id. - person Oleg; 14.05.2010

Я не знаю, как опубликовать дополнительные данные, но вы можете попробовать отправить дополнительные данные в качестве параметров строки запроса как часть URL-адреса удаления.

person Wolf    schedule 18.01.2011

Да, вы можете добавить дополнительные данные в постданные, используя событие onclickSubmit в параметрах del navgrid. В вашем случае, если вы хотите отправить user_id, включая идентификатор, сделайте что-то вроде этого

$("#gridId").jqGrid({
    }).hideCol(['']).navGrid('#pagerId', {
        edit: false, add: false, del: true, search: true, refresh: true, beforeRefresh: function () {
        }, afterRefresh: function () {
        }
    }, {}, {}, {
        afterComplete: function () {
        }, onclickSubmit: function (params) {
            var extraParameters = [];  var arraySelected = $("#gridId").jqGrid('getGridParam', 'selarrrow');
            for (var i = 0; i < arraySelected.length; i++) {
                 extraParameters.push($('#gridId').getRowData(arraySelected[i]).user_id)
            } 
            return { extraParams: extraParameters.join(',') };
        }
    },
    {
        sopt: ['cn', 'nc'], onSearch: function () {
        },
        onReset: function () {
        }
    });
person Aditya    schedule 19.11.2014