在Easyui-datagrid嵌入下拉框（combobox）

Easyui中datagrid中嵌入combobox并赋值传值

---

显示组合框

- 官网这样说的

   要在datagrid里面做个带复选框的列表时，查阅了官网，发现了个编辑器，编辑器允许你用添加不用类型的东西，获取的方法是酱紫的：

• 获取编辑器之前

  在做到之前有个不能够忽略的前提：*设置单元行可编辑！！ 3 血的教训啊喂= =

然后就是状态了，看你需要单击单元格还是单击一整行获取这个编辑器了有
onClickRow和onClickCell视情况自己选择。

            onClickRow: function (rowIndex, rowData) {                $("#userFileList").datagrid('selectRow', rowIndex);                $("#userFileList").datagrid('beginEdit', rowIndex);//设置可编辑状态            }

• 记得转换格式噢

    function unitFormatter(value, rowData, rowIndex) {        if (value == 0) {            return "";        }        for (var i = 0; i < jsonContent.length; i++) {            if (jsonContent[i].value == value) {                return jsonContent[i].text;            }        }        return value;    }

而在datagrid中添加editor代码如下，formatter是用于格式化显示单元格内容的，jsonContent是一串JSON字符串，不知道格式的自己Google去- -

{                    field: 'isUpload',                    title: '标题',                    width: 40,                    formatter: unitFormatter,                    align: 'center',                    editor: {                        type: 'combobox',                        options: {                            data: jsonContent,                            valueField: "value",                            textField: "text",                            editable: false                        }                    }                }

• 另一种方法Editors
  当然，你还可以采用另一种方式：getEditors,但是根据debug结果发现我页面的返回的是长度为1的数组，不知道算不算是个坑。

所以最后代码需要在后面加个[0]：

  onClickCell: function (rowIndex, field, value) {       $("#userFileList").datagrid('selectRow', rowIndex);//选中这一行       $("#userFileList").datagrid('beginEdit', rowIndex);//设置可编辑状态       var ed = $('#userFileList').datagrid('getEditors', rowIndex)[0];       $(ed.target).combobox('setValue', jsonContent[1].value); //设置默认显示的值  }

• 显示效果

最后结果有点丑哈哈哈，不过还是完成了目标：

大功告成，这样我们就能完成了datagrid中下拉框的添加啦，不同类型类推就ok了。