您现在的位置:首页 >> 前端 >> 内容

easyUI运用小技巧

时间:2018/1/10 13:57:16 点击:

  核心提示:一、显示分页(pagination:true)情况下,隐藏每页显示的记录条数的那个select(即pageList),下图 方法onBeforeLoad:function(param){$(#+$(t...

一、显示分页(pagination:true)情况下,隐藏每页显示的记录条数的那个select(即pageList),下图

easyUI运用小技巧

方法

onBeforeLoad:function(param){

$('#'+$(this)[0].id).datagrid('getPager').pagination({

showPageList:false

});

},

onLoadSuccess:function(data){

$('#'+$(this)[0].id).datagrid('getPager').pagination({

showPageList:false

});

}

方法2:

onBeforeLoad:function(param){

$('.pagination-page-list').hide();

},

onLoadSuccess:function(data){

$('.pagination-page-list').hide();

}

方法3:

css样式:select.pagination-page-list{display:none}

方法4:

$("#dgOrderList").datagrid({

url:'。。。',

queryParams:{。。。},

});

写在datagrid获取数据url之后,

$("#dgOrderList").datagrid('getPager').pagination({

showPageList: false

});

二、在第n页,检索,利用queryParams方法,datagrid组装参数时,会自动添加page=n,而不会切换到第1页

方法1:

$("#dgOrderList").datagrid({

pageNumber:1,

url:url,

queryParams:{key:name,value:value}

});

方法2:用load方法

$dgOrderList.datagrid('load',param);//会自动添加&page=1&rows=。。

param为空对象时:$('#dgWorkers').datagrid('load',{});//会去除page、rows以外的参数,且置page=1

三、个人常用,mark一下

$.messager.confirm('提示','确定要删除所选项目吗?',function(r){

if (r){}

})

四、linkbutton的disabled并不阻止事件,需要在事件中进行判断

if($(this).linkbutton('options').disabled){

return false;

}

五、dialog闪现问题。在一个页面使用一个dialog,初始隐藏(closed="true"),但是在页面刷新的一瞬间,这个dialog会显示出来,效果非常难看

方法一:

dialog用一个隐藏p包含起来,一个p包好几个diglog也可以,显示的时候直接dialog('open')就可以

方法二:

设定dialog的style display:none,然后在页面加载完后再让它display:block或show(),或者$('dialog').show().dialog('open')

六、显示尾行合计(图片与下文无关)

easyUI运用小技巧

方法一,加载后在js中计算,但对formatter的列无效

//表格定义时显示footer

showFooter:true,

//定义加载成功事件,列名:数据

onLoadSuccess:function(data){

$(this).datagrid('reloadFooter', [{

heJi:'合计',

tNo:compute(data.rows, "tNo"),

workhour:compute(data.rows, "workhour"),

pay:compute(data.rows, "pay"),

}]);

},

//定义合计函数

function compute(rows,colName) {

var total = 0;

for (var i = 0; i < rows.length; i++) {

total += parseFloat(isNaN(rows[i][colName])||$.trim(rows[i][colName])==''?0:rows[i][colName]);

}

return parseFloat(total.toFixed(2));

}

方法二、后台返回一个footer行(PHP为例)

showFooter:true,

//footer行对应列要显示的内容,如合计后的内容,可以加一个标识如footer,用于标明改行是footer内容,在formatter时可能会用到

$footer=array(array('heJi'=>'合计','tNo'=>$tNo,'workhour'=>$workhour,'pay'=>$pay,'footer'=>1));

//返回数据中以footer为键值

echo json_encode(array('code'=>1,'msg'=>'查询成功','total'=>count($rows),'rows'=>$rows,'footer'=>$footer));

注:footer行的显示同样受formatter影响

七、获得当前选中的tabs

1、varindex=$('#tabs').tabs('getTabIndex',$('#tabs').tabs('getSelected')); //从0开始 2、tabs的onSelect改变一个全局变量的值,用于标记选中的tab 八、easyui combobox禁止输入 下拉框高度设置:panelHeight:'auto' 九、easyui-validate类型的输入框,可以直接 触发onblure()事件, easyui-textbox类型的输入框,onblure()事件需要换一种触发方式: $("input",$("#loginName").next("span")).blur(function(){ alert("登录名已存在"); }) js 判断两字符串是否相等, 不区分大小写toLowerCase() 十、datagrid view 给列设置默认值 formatter:function(value,row){ if(value=='00'){ return"是"; }elseif(value=='01'){ return"否"; } } 转载于http://blog.csdn.net/t_1007/article/details/52316604 阅读全文 顶 1 踩 0 上一篇easyUI 开发问题整理

Tags:EA AS SY YU 
作者:网络 来源:sinat_3425