Плагин jQuery EasyUI DataGrid и Tree -Propertygrid — сетка свойств
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 Другие расширения