向现有 JQGRID 添加新列答案

【问题标题】：Adding a new column to existing JQ GRID向现有 JQGRID 添加新列
【发布时间】：2014-09-21 19:17:12
【问题描述】：

我正在开发 AbanteCart，其中使用 JQgrid 以表格形式显示订单相关信息。现在，我想在此表中添加一个新列。到目前为止我尝试过的代码如下：

    $grid_settings['colNames'] = array(
        $this->language->get('column_order'),
        $this->language->get('column_name'),

        $this->language->get('column_status'),
        $this->language->get('column_mode'),//Column Name that I added
        $this->language->get('column_date_added'),
        $this->language->get('column_total'),
    );
    $grid_settings['colModel'] = array(
        array('name' => 'order_id',
            'index' => 'order_id',
            'align' => 'center',),
        array('name' => 'name',
            'index' => 'name',
            'align' => 'center'),
        array('name' => 'status',
            'index' => 'status',
            'align' => 'center',
            'search' => false),
            array('name' => 'payment',//Column data that I added 
            'index' => 'payment',
            'align' => 'center',
            'search' => false),
        array('name' => 'date_added',
            'index' => 'date_added',
            'align' => 'center',
            'search' => false),
        array('name' => 'total',
            'index' => 'total',
            'align' => 'center'),
    );

这是我做出的两个改动。但它只在网格中显示列名，但不显示与该列相关的数据。我还需要更改代码以显示 JQgrid 中的更改吗？

姓名、状态、付款等变量来自数据库。

提前感谢您的帮助。

【问题讨论】：

jqGrid add new column 的可能重复项
@Filly 我只想在网格中添加一个新列。我不想在某些动作上动态添加新网格。例如，以前显示 5 列的网格，我想添加一个新列并使该网格显示 6 列。
付款应该出现在您的结果集中，例如，如果您使用 select * 从 sql 表中获取结果...应该存在列 payement
@kastormania 是的，它确实存在。我还尝试了列“名称”而不是“付款”。但它没有奏效。所以结果集获取没有问题。因为列 'name' 在其所在位置的网格上工作正常，但是当替换 'payment' 时，它不起作用。

标签： jquery jqgrid jqgrid-php mvcjqgrid

【解决方案1】：

了解 jqGrid 创建具有所有内部结构的网格一次很重要。 jqGrid 不提供允许添加新列的方法。所以你有以下选择：

使用GridUnload 将网格“销毁”为空<table> 并使用新列重新创建网格（请参阅the answer）
创建带有附加隐藏列的网格，并在需要添加新列时使用showCol 使隐藏列可见。这样您将获得与添加列相同的效果。

顺便说一下，如果您在网格中加载数据的命名属性（您的 JSON 输入数据看起来像 {"order_id":"123", "name": "abc" , "status": "OK"...}），您可以将 colModel 定义为

colModel: [
    {name: "c1", key: true, jsonmap: "order_id"},
    {name: "c2", jsonmap: "name"},
    {name: "c3", jsonmap: "status"},
    ...
]

使用通用名称 c1 c2, c3, ... 用于列。您可以在运行时轻松修改jsonmap 的值。您可以设置hidden: true 属性或删除它等。The answer 显示如何使用beforeProcessing 根据服务器响应修改colModel。通过这种方式，您可以使 jqGrid 完全动态化。

【讨论】：