EasyUI Propertygrid属性网格 下拉框实现

1、数据整理

var data=[{roleid: "1", proleid: "-1", rolename: "系统管理员", appcode: "01", creator: "1"},
{roleid: "2", proleid: "-1", rolename: "部门领导", appcode: "01", creator: "1"},
{roleid: "3", proleid: "-1", rolename: "主管领导", appcode: "01", creator: "1"}]

2、格式整理---combogrid属性

var role = {
            "type": "combogrid", "options": {
                idField: 'roleid',
                textField: 'rolename',
                fitColumns: true,
                multiple: true,
                columns: [[
                    {field: 'roleid', title: 'roleid', width: 80},
                    {field: 'rolename', title: 'rolename', width: 120},
                ]],
                data: data //来源于
            }
        }

3、Propertygrid属性数据组合

var rows = [
            {
                "name": "角色",
                "alias": "role",
                "value": "",
                "group": "人员指派",
                "editor": role//来源于2
            }
        ]

4、渲染属性控件

 function loadnodeprop(data) { //data来源与3的整理
		console.log(data);
        var mycolumns = [[
            {field: 'name', title: '属性', width: 100, sortable: false},
            {field: 'value', title: '值', width: 100, resizable: false}
        ]];
        var obj = {
            data: data,
            showGroup: true,
            scrollbarSize: 0,
            onAfterEdit: function (rowIndex, rowData, changes) {
                onAfterEdit(rowIndex, rowData, changes);
            },
            columns: mycolumns
        }
        $('#pg').propertygrid(obj);
    }