学步园

@author YHC

从$.fn.datagrid.defaults继承,覆盖默认值 $.fn.propertygrid.defaults

propertygrid
提供用户一个接口,浏览和编辑对象属性,propertygrid 是一个内联的datagrid编辑器,使用相当简单,用户可以很简单的创建一个分层可编辑属性列表,代表任何数据类型项,propertygrid
带有内置的排序和分组功能.

相关依赖

• datagrid

使用

按照标记创建propertygrid ,注意它的行是内置的,不需要重新创建.

<table id="pg" class="easyui-propertygrid" style="width:300px"  
        data-options="url:'get_data.php',showGroup:true,scrollbarSize:0"></table>  

使用javascript创建propertygrid 

<table id="pg" style="width:300px"></table>  

$('#pg').propertygrid({  
    url: 'get_data.php',  
    showGroup: true,  
    scrollbarSize: 0  
});  

附加一个新行到propertygrid

var row = {  
  name:'AddName',  
  value:'',  
  group:'Marketing Settings',  
  editor:'text'  
};  
$('#pg').propertygrid('appendRow',row);  

Row Data

propertygrid从datagrid继承.行数据格式和datagrid相同,作为一个property
row,以下字段是必须的:

 name:字段名称.
value: 可编辑的字段值.
group:分组字段值.
editor: 编辑器,当编辑属性值的时候.
row data 示例:

{"total":4,"rows":[  
    {"name":"Name","value":"Bill Smith","group":"ID Settings","editor":"text"},  
    {"name":"Address","value":"","group":"ID Settings","editor":"text"},  
    {"name":"SSN","value":"123-456-7890","group":"ID Settings","editor":"text"},  
    {"name":"Email","value":"bill@gmail.com","group":"Marketing Settings","editor":{  
        "type":"validatebox",  
        "options":{  
            "validType":"email"  
        }  
    }}  
]}  

   以上如有错误信息,,请指出,thanks!