Плагин jQuery EasyUI DataGrid и Tree -Propertygrid — сетка свойств


jQuery EasyUI 插件jQuery EasyUI Плагины

Расширяет $.fn.datagrid.defaults. Переопределите настройки по умолчанию через $.fn.propertygrid.defaults.

Propertygrid предоставляет пользователям интерфейс для просмотра и редактирования свойств объекта. Propertygrid — это таблица данных с встроенным редактированием. С ним довольно легко работать. Пользователи могут легко создавать иерархический список редактируемых свойств и элементов, представляющих любой тип данных. Propertygrid имеет встроенные функции сортировки и группировки.

Зависимости

  • datagrid

Использование

Создайте propertygrid в разметке. Обратите внимание, что столбцы встроены и их не нужно объявлять повторно.

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

Создайте propertygrid с помощью JavaScript.

<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);

Данные строки

propertygrid наследуется от datagrid. Формат данных его строки совпадает с datagrid. Для строки свойства требуются следующие поля:
name: Имя поля.
value: Значение поля для редактирования.
group: Значение поля группы.
editor: Редактор, используемый для редактирования значения свойства.

Пример данных строки:

{"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"
        }
    }}
]}

Свойства

Эти свойства наследуются от datagrid. Ниже перечислены свойства, добавленные для propertygrid.

Name Type Описание Значение по умолчанию
showGroup логическое значение Определяет, отображать ли группы свойств. false
groupField string Определяет имя поля группы. group
groupFormatter function(group,rows) Определяет, как форматировать значение группы. Эта функция включает следующие параметры:
group: имя поля группы.
rows: строки, принадлежащие группе.

Методы

Эти методы расширяют datagrid. Ниже приведены методы, добавленные для propertygrid.

Name Parameters Описание
expandGroup groupIndex Развернуть указанную группу. Если параметр 'groupIndex' не задан, развернуть все группы.
collapseGroup groupIndex Свернуть указанную группу. Если параметр 'groupIndex' не задан, свернуть все группы.

jQuery EasyUI 插件Плагины jQuery EasyUI Другие расширения