2

に追加のパラメーターを POST する方法を理解しようとして、例とドキュメントを見て数時間を費やしましたがediturl、まだこれを理解していません。Perl Catalyst を使用しています。

コントローラーですべてをコーディングしているわけではありませんが、レコードを削除するのではなく、追加および編集するために POST する必要があるものを取得しています。inv_idコントローラーがレコードを削除するには、サーバーに POST する必要があります。

コントローラ/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;

index.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していて、本当に両方の値が必要な場合は、たとえば、削除オプションのonclickSubmitidコールバックを使用できます。のinv_id

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 に答える