接触到easyUI是从工作开始,最常用的是datagrid和input框的各种“变形”。下面总结一下这俩种用法
常用的input框的class有easyui-my97(时间)、easyui-validatebox(输入框)、easyui-combobox(下拉框):
(1)easyui-my97
//easyui-my97
其中data-options中用于约束日期格式、是否必填等。
$('#jzsj').my97({required: true,disabled:false});
(2)easyui-validatebox
//启用必填
$('#contaWay').validatebox({required:true,missingMessage:'该输入项为必输项'});
$('#contaWay').attr('disabled',false);
//取消必填并清空,禁用
$('#contaWay').validatebox({required:false});
$('#contaWay').val('');
$('#contaWay').attr('disabled',true);
html
js
$(function(){
//自定义单选多选以及不校验方法
$.extend($.fn.validatebox.defaults.rules, {
radio: {
validator: function () {
var _form = $(this).parents("form");
var _input = _form.find("input[name='"+this.name+"']");
for(var i=0;i<_input.length;i++){
if(_input[i].checked) {
return true;
}
}
return false;
},
message: '请选择一项!'
},
noCheak: {
validator: function () {
return true;
},
message: '请选择一项!'
},
checkbox:{
validator: function () {
debugger;
var _form = $(this).parents("form");
var _input = _form.find("input[name='"+this.name+"']");
for(var i=0;i<_input.length;i++){
if(_input[i].checked) {
return true;
}
}
return false;
},
message: '请至少选择一项!'
}
})
}
(3)easyui-combobox
先放一个案例,datagrid的属性和方法有很多,当然功能也很强大,其实遇到问题查API是最好的方法。
dg= $("#dg").datagrid({
method:'get',
url:'infectioncardJDJson',
queryParams:obj,
singleSelect : true,
frozenColumns:[[
{field:'ckx',checkbox : true},
{field:'patientName',title:'患者姓名',width:150,align : 'center'},
]],
columns:[[
{
field:'cardId',
title:'卡片id'
},{
field:'nmTag',
title:'报告方式'
}, {
field : 'cardCode',
title : '卡片编号',
width : 200,
align : 'center'
}, {
field : 'nmCardType',
title : '报卡类型',
width : 150,
align : 'center'
}, {
field : 'nmCasetype',
title : '病例分类',
width : 150,
align : 'center'
}, {
field : 'nmGroupId',
title : '人员职别',
width : 150,
align : 'center'
}, {
field : 'nmSpecialGroup',
title : '特殊职业',
width : 150,
align : 'center'
}, {
field : 'nmSex',
title : '性别',
width : 150,
align : 'center',
},{
field:'intime',
title:'录入时间'
}
]],
onLoadSuccess:function(){
//改变某一行的某个数据
$(this).datagrid('updateRow',{
index:1,
row:{cardId:'hhh'}
})
//追加一行
$(this).datagrid('appendRow',{
patientName:'测试',
cardId:'123',
nmTag:'初次报告',
nmSex:'男'
})
}
})
其中常用属性与方法有: