easyUI 一些调用总结
本帖最后由 李维强-15级 于 2016-10-30 23:17 编辑去除插件属性
easyui-dialog 右上角 红叉关闭事件
加载combobox后就选择其中一个的方法
常用插件启用禁用方法
combobox调用注意事项
GET方式从前台传参数给后台
conbobox下拉框高度设置
easyui combobox 加载数据后在前面插入一条“全部”
本帖最后由 李维强-15级 于 2016-5-24 23:56 编辑
easyui-dialog 关闭事件 就是点右上角那个红× 的事件
Jqurey 操作
$('#edit').dialog({ //edit是dialog的id
onClose: function () {
alert("关闭了哦");
}
});
目前发现这个要影响一些其他插件的显示例如 easyui-numberbox 的宽度会变很窄 所以要加个style="width:120px;" 上去就可以了
页面里面的combobox
<select class="easyui-combobox" style="width:142px;" id="addTruckID"data-options="editable:false,
valueField:'TruckID',
textField:'PlateNum'" name="TruckID" >
</select>
JS里面代码如下： 想让combobox加载过后就选中其中一个的做法
$("#addTruckID").combobox({
onLoadSuccess: function () {
var val = $(this).combobox("getData");
for (var item in val) {
if (item == "TruckID") { //TruckID 就是选择列表里面的valueField
$(this).combobox("select", val);
}
}
}
});
本帖最后由 李维强-15级 于 2016-10-5 10:01 编辑
EasyUI常用控件禁用方法：
一旦禁用后$("#editFrom").form('validate')和$("#editFrom").serialize()返回的值 都不包含禁用了的插件部分的信息了 所以这点注意
写在页面上的方式
<input class="easyui-validatebox" readonly="readonly"type="text" style="width:185px;" id="addGetStuffAddress" data-options="required:true"/>
JS的方式如下
1.validatebox可以用的用法:前两种适用于单个的validatebox;
第三种应用于整个form里面的输入框;
<1>.$("#id").attr("readonly", true); -----$("#id").removeAttr("readonly");
<2>.$("#id").attr("readonly", "readonly"); -----$("#id").removeAttr("readonly");
<3>.$("#Form :input").attr("readonly", "readonly"); //对form里面的禁用
<4>.$("input").attr("readonly", "readonly"); //对所有的input标签禁用
2.combobox禁用启用用法:
<1>.$("#id").combobox({ disabled: true }); -----$("#id").combobox({ disabled: false});
<2>.$("#id").attr("readonly", "readonly");//对单个禁用 -----$("#id").removeAttr("readonly");
<3>.$("#fm .easyui-combobox").combobox({ disabled: true });//对form里面的下拉框禁用
<4>.$("#ID").combobox("disable"); ------ $("#ID").combobox("enable");
3.datebox与datetimebox禁用启用方法:
<1>.$("#fm .easyui-datebox").datebox({ disabled: true }); -----$("#fm .easyui-datebox").datebox({ disabled: false});
<2>.$("#id").attr("readonly", "readonly");-----$("#id").removeAttr("readonly");
<3>.$("#fm .easyui-datetimebox").datetimebox({ disabled: true }); ----- $("#fm .easyui-datetimebox").datetimebox({ disabled: true });
4.combogrid禁用启用方法:
<1>.$("#FPayApplySupAccountID").combogrid("disable"); ----- $("#FPayApplySupAccountID").combogrid("enable");
5.lable标签ID附加文字：
<1>.$("#id").text("标题:"); //此方法可以屏蔽掉lable标签内的文字
6.numberbox禁用方法
$("#ID").numberbox('enable');
$("#ID").numberbox('disable');
本帖最后由 李维强-15级 于 2016-6-10 14:22 编辑
combobox调用注意事项
清空combobox里面的值，用
$("#addGoodsType").combobox('loadData', {});
$("#addGoodsType").combobox('clear'); 方法 只是抹去当前列表框里面的值
============================================================
<select class="easyui-combobox"style="width:142px;" id="qstate">
<option value="-1">全部状态</option>
<option value="0">未完成</option>
<option value="1">已完成</option>
<option value="2">已取消</option>
</select>
在写页面的这个时候value 里面要填值 不要为空 <option value="">全部状态</option>这样会出未知错误
//GET方式传参数前台用?传参数
$("#editCementType").combobox("reload", "/Demand/findCementType?id=" + param.GoodsName);
//下面是后台代码
//需要用Request.QueryString["XX"]来获取前台传进来的参数值
string GoodsName = Request.QueryString["id"] + "";
修改combobox的下拉框的高度为自适应高度
combobox控件data-options="panelHeight:'auto'"或者把auto变成相应的数字即可
var relation_id_sign = 0;//标签
$("#relation_id").combobox({
url: '<?php echo $this->set_url('relation', 'relation', 'get_relationGroupJson'); ?>',
method: 'get',
valueField: 'id',
textField: 'relation_name',
editable: false,
panelHeight: 'auto',
onLoadSuccess: function() {
if (relation_id_sign == 0)
{
var data = $(this).combobox('getData');
data.insert(0, {'id':'0','relation_name':'全部'});
relation_id_sign++;
$("#relation_id").combobox("loadData", data);//重新加载数据，且当 relation_id_sign==1时加载
}
}
});
页:
[1]