使用数据源进行 W2UI 网格内联编辑

Question

我使用的是 w2ui Grid 的 1.4.1 版。我正在尝试执行inline edit，同时使用urls property 从服务器加载数据。

$(function () {
    $('#grid').w2grid({ 
        name: 'grid',
        // begin block that causes grid to be uneditable 
        // url: {
        //    get    : '<?php echo site_url('sections')?>/all',
        //    save   : '<?php echo site_url('sections')?>/save'
        // },
        // end block that causes grid to be eneditable
        show: { 
            toolbar: true,
            footer: true,
            toolbarSave: true,
            toolbarEdit: true
        },
        columns: [  
                  { 
                      field: 'code', 
                      caption: 'Code', 
                      size: '120px', 
                      sortable: true, 
                      resizable: true, 
                      editable: { 
                          type: 'text' 
                      }
                  }
                   ],
         // this records array can be removed once the urls are added back
         records: [
             { recid: 1, code: '100' }
         ]

    });    
});

如果我取消注释“url”块，网格上的“代码”字段在双击时不再可编辑。如果我删除它，它就是。有没有人有一个从服务器动态加载数据同时还允许内联编辑的工作示例？

回答 如下所述，我的退货结构不正确。我在后端使用CodeIgniter (CI)，我的控制器方法如下所示：

public function all() {
    $data = $this->myModel->findAll ();
    $gridData = new W2GridData ( $data );
    echo $gridData->toJson();  //important to put "echo" here and not "return"
}

我的模型类中的 findAll() 方法在哪里：

    function findAll() {
        $query = $this->db->get ( TABLE_NAME );
        return $query->result ();
    }

我用于包装 CI db 结果的实用程序类现在是：

<?php
class W2GridData {
    var $total = "-1";
    var $records = "-1";
    function __construct($items) {
        $this->records = $items;
        $this->total = count ( $this->records );
    }
    function toJson() {
        $strValue = json_encode ( $this );
        return str_replace ( "\"id\":", "\"recid\":", $strValue );  // this line was missing
    }
}

如您所见，我直接从数据库返回“id”，并没有将其转换为 w2ui 的首选“recid”，因此网格未正确呈现。

Answer 1

我将您的代码完全按照原样、未注释的 url 和删除的记录。另外，我将它链接到一个静态 JSON 文件（如果将它链接到返回 JSON 的 php，应该没有什么不同）。但是，从服务器填充网格后，内联编辑工作得很好。我用的是 1.4.1 版本。我最好的猜测是（1）你在控制台中有一个javascript错误，或者（2）你的服务器没有返回正确的结构。这是我的 JSON 文件：

{
  "total": "3",
  "records": [{
     "recid": 1,
     "code": "Some"
  }, {
     "recid": 2,
     "code": "Another"
  }, {
     "recid": 3,
     "code": "More"
  }]
}

Answer 2

我的简单方法，添加属性 recid : 'id'

$('#grid').w2grid({ 
    name: 'grid',
    recid : 'id'
  });