ligerui demo php,ligerui grid行编辑示例
ligerui grid行编辑示例，具备新增行、删除行功能，可在修改某个cell之后，如果录入错误，可以提醒用户。
String path = request.getContextPath();
%>
ZTREE DEMO - Simple Datavar contextpath = "";
.myul li{float:left;width:100px;display:inline;}
var manager, g;
$(document).ready(function(){
$("#leafOpt").click(function(){
$("#urlDom").show();
});
$("#dirOpt").click(function(){
$("#urlDom").hide();
});
//初始化grid
function itemclick(item)
{
alert(item.text);
}
var typeData = [{ val: 'url', text: 'URL' }, { val: 'btn', text: '按钮'}, { val: 'code', text: '分级编码'}];
var rowData = { Rows: []};
g = manager = $("#maingrid").ligerGrid({
columns: [
{ display: '名称', name: 'name', align: 'left', width: 120,editor: { type: 'text' } } ,
{ display: '类型', width: 60, name: 'type',
editor: { type: 'select', data: typeData, valueColumnName: 'val' },
render: function (item)
{
for (var i = 0; i < typeData.length; i++)
{
if (typeData[i]['val'] == item.type)
return typeData[i]['text']
}
}
},
{ display: '值', name: 'value', width: 360, align: 'left',editor: { type: 'text' } }
], sortName: 'name',enabledEdit: true, data: rowData,
onSelectRow: function (rowdata, rowindex)
{
$("#txtrowindex").val(rowindex);
},
onBeforeEdit: onBeforeEdit, onBeforeSubmitEdit: onBeforeSubmitEdit,onAfterEdit: onAfterEdit,
width: '98%', height: '350', usePager: false, clickToEdit: true, checkbox: true
});
});
function deleteRow()
{
g.deleteSelectedRow();
}
function addNewRow()
{
g.addRow({
id : 0,
name:'',
type:'url',
value:''
});
}
//设置name前缀
function onBeforeEdit(e)
{
var data = manager.getData();
return true;
}
//限制年龄
function onBeforeSubmitEdit(e)
{
if (e.columnname == "Age")
{
if (e.value < 20 || e.value > 30) return false;
}
return true;
}
//编辑后事件
function onAfterEdit(e)
{
//当切换类型时，自动填充名称前缀
//alert(JSON.stringify(e.record));
//alert("after, e.column: "+JSON.stringify(e.column));
if(e.column.name=="type") {
var data = manager.getData();
var d = data[e.rowindex];
var name = '';
if(d.type=="url")
name="url";
else if(d.type=="code")
name="code_";
else if(d.type=="btn")
name="btn_";
g.updateCell('name', name, e.record);
}
//当名称修改后，校验前缀是否与类型匹配
if (e.column.name == "name")
{
var d = e.record;
var cellObj = g.getCellObj(d, e.column);
//var name = d[e.column.name];
var name = $(cellObj).text();
if(name.length<1)
return true;
if(d.type=="url" && name.indexOf(d.type)!=0) {
alert('你刚才编辑的值录入不正确！(类型为URL时，名称必须以url开头(小写))');
//cellObj.focus();
//g.setCellEditing(d, e.column, editing);
return false;
} else if(d.type=="code" && name.indexOf(d.type)!=0) {
alert('你刚才编辑的值录入不正确！(类型为分级编码时，名称必须以code_开头(小写))');
//g.setCellEditing(d, e.column, editing);
return false;
} else if(d.type=="url" && name.indexOf(d.type)!=0) {
alert('你刚才编辑的值录入不正确！(类型为按钮时，名称必须以btn_开头(小写))');
//g.setCellEditing(d, e.column, editing);
return false;
}
}
return true;
}
目录节点 叶子节点 | |
| 节点名称 | |
| 叶子url | |
| 分级编码 | |