2

我花了几个小时查看示例和文档，试图弄清楚如何将附加参数 POST 到editurl，但还没有弄清楚。我正在使用 Perl 催化剂。

虽然我没有在控制器中全部编码，但我得到了我需要发布的内容来添加和编辑，而不是删除记录。我需要inv_id将我的控制器发布到服务器才能删除记录。

控制器/Root.pm：

package MyFirstGrid::Controller::Root;
use Moose;
use namespace::autoclean;

BEGIN {extends 'Catalyst::Controller'}
with 'Catalyst::TraitFor::Controller::jQuery::jqGrid';

__PACKAGE__->config(namespace => '');

sub index :Path :Args(0) {
  my ($self, $c) = @_;

  $c->detach($c->view("TT"));
}

sub getdata :Local {
  my ($self, $c) = @_;

  my $inv_rs = $c->model('DB::Inventory')->search({});
  $inv_rs = $self->jqgrid_page($c, $inv_rs);
  my @row_data;
  while (my $inv = $inv_rs->next) {
    my $single_row = {
      cell => [
        $inv->inv_id,
        $inv->client_id,
        $inv->amount,
        $inv->tax,
        $inv->total,
        $inv->note,
      ],
    };
    push @row_data, $single_row;
  }
  $c->stash->{json_data}{rows} = \@row_data;
  $c->detach($c->view("JSON")); 
}

sub postrow :Local {
  my ($self, $c) = @_;

  my $data = $c->req->params;
  my $inv_rs = $c->model('DB::Inventory')->search({inv_id => $data->{inv_id}});
  $inv_rs->update({
    client_id => $data->{client_id},
    amount => $data->{amount},
    tax => $data->{tax}, 
    total => $data->{total}, 
    note => $data->{note}, 
  });
  $c->res->status(204); 
}

sub default :Path {
  my ($self, $c) = @_;

  $c->response->body('Page not found');
  $c->response->status(404);
}

sub end : ActionClass('RenderView') {}

__PACKAGE__->meta->make_immutable;

1;

索引.tt：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My First Grid</title>

<link rel="stylesheet" type="text/css" media="screen" href="[% c.uri_for('/static/css/cupertino/jquery-ui-1.8.22.custom.css') %]" />
<link rel="stylesheet" type="text/css" media="screen" href="[% c.uri_for('/static/css/ui.jqgrid.css') %]" />

<style type="text/css">
html, body {
  margin: 0;
  padding: 0;
  font-size: 75%;
}
</style>

<script src="[% c.uri_for('/static/js/jquery-1.7.2.min.js') %]" type="text/javascript"></script>
<script src="[% c.uri_for('/static/js/i18n/grid.locale-en.js') %]" type="text/javascript"></script>
<script src="[% c.uri_for('/static/js/jquery.jqGrid.min.js') %]" type="text/javascript"></script>

<script type="text/javascript">
$(function(){ 
  $("#list").jqGrid({
    url: "[% c.uri_for("getdata") %]",
    datatype: 'json',
    mtype: 'GET',
    colNames:['Inv No', 'Client ID', 'Amount','Tax','Total','Notes'],
    colModel :[ 
      //{name:'inv_id', index:'inv_id', editable:true, hidden:true, editrules:{edithidden:false}, hidedlg:true}, 
      {name:'inv_id', index:'inv_id', editable:true, hidden:true}, 
      {name:'client_id', index:'client_id', width:55, editable:true, editoptions:{size:10}},
      {name:'amount', index:'amount', width:80, align:'right', editable:true, editoptions:{size:10}}, 
      {name:'tax', index:'tax', width:80, align:'right', editable:true, editoptions:{size:10}}, 
      {name:'total', index:'total', width:80, align:'right', editable:true, editoptions:{size:10}}, 
      {name:'note', index:'note', width:150, sortable:false, editable: true, edittype:"textarea", editoptions:{rows:"2",cols:"20"}} 
    ],
    pager: '#pager',
    rowNum:10,
    rowList:[10,20,30],
    sortname: 'inv_id',
    sortorder: 'desc',
    viewrecords: true,
    caption: 'My First Grid: Navigator',
    editurl: "[% c.uri_for("postrow") %]",
    height: 240
  }); 

  jQuery("#list").jqGrid('navGrid','#pager',
    {}, //options
    {height:280,reloadAfterSubmit:false}, // edit options
    {height:280,reloadAfterSubmit:false}, // add options
    {reloadAfterSubmit:false}, // del options 
    {} // search options
  ); 

}); 
</script>
</head>

<body>
<table id="list"><tr><td/></tr></table> 
<div id="pager"></div> 
</body>
</html>
4

1 回答 1

2

我想您遇到的问题的根源在于填充网格。在填充网格期间，所有网格的行（<tr>元素）都获得id属性。在编辑和删除行期间，id相应行的属性值将始终发送到服务器。重要的是要知道id属性的值在页面上必须是唯一的。如果 的值inv_id是唯一的，那么您可以直接将此值用作id. 要通知 jqGrid 您可以添加jsonReader: {id: "inv_id"}作为附加网格参数的选择，或者只是将key: true属性添加到inv_id列的定义中。

我自己不使用 Perl Catalyst，但在我看来，您填充网格数据的部分（请参阅 参考资料）除了属性之外还my $single_row = { cell => [...]}应该包含属性（类似于）。如果它是唯一的，那么添加到列的定义中会更好，您的问题将已经解决。idcell$single_row = {cell => [...], id => $inv->inv_id}inv_idkey: trueinv_id

如果您已经使用了另一个值，id并且您确实需要同时拥有这两个值：id然后inv_id您可以使用例如删除选项的onclickSubmit回调。这

onclickSubmit: function (options, rowid) {
    return {inv_id: $(this).jqGrid("getCell", rowid, "inv_id")};
}

我的意思是使用以下内容

$("#list").jqGrid('navGrid', '#pager', {}, //options
    {height: 280, reloadAfterSubmit: false}, // edit options
    {height: 280, reloadAfterSubmit: false}, // add options
    { // del options
        reloadAfterSubmit: false,
        onclickSubmit: function (options, rowid) {
            return {inv_id: $(this).jqGrid("getCell", rowid, "inv_id")};
        }
    }
);

因此，在删除操作期间发布到服务器的数据将使用附加参数进行扩展inv_id。

于 2012-09-09T17:09:49.637 回答