easyui 一些小技巧
一、顯示分頁(pagination:true)情況下,隱藏每頁顯示的記錄條數(shù)的那個select(即pageList),下圖箭頭
方法1:
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獲取數(shù)據(jù)url之后,
? ? ? ? $("#dgOrderList").datagrid('getPager').pagination({
? ? ? ? ? ? showPageList: false
? ? ? ? });
二、在第n頁,檢索,利用queryParams方法,datagrid組裝參數(shù)時,會自動添加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以外的參數(shù),且置page=1
三、個人常用,mark一下
? ? $.messager.confirm('提示','確定要刪除所選項(xiàng)目嗎?',function(r){
? ? ? ? if (r){}
? ? })
四、linkbutton的disabled并不阻止事件,需要在事件中進(jìn)行判斷
? ? if($(this).linkbutton('options').disabled){
? ? ? ? ? ? return false;
? ? }
?
五、?dialog閃現(xiàn)問題。在一個頁面使用一個dialog,初始隱藏(closed="true"),但是在頁面刷新的一瞬間,這個dialog會顯示出來,效果非常難看
方法一:
<div style="display:none">
? ? <div class="easyui-dialog"></div>
</div>
dialog用一個隱藏div包含起來,一個div包好幾個diglog也可以,顯示的時候直接dialog('open')就可以
方法二:
設(shè)定dialog的style ?display:none,然后在頁面加載完后再讓它display:block或show(),或者$('dialog').show().dialog('open')
?
六、顯示尾行合計(圖片與下文無關(guān))
? ? 方法一,加載后在js中計算,但對formatter的列無效
//表格定義時顯示footer
? ? ? ? showFooter:true,
//定義加載成功事件,列名:數(shù)據(jù)
? ? ? ? onLoadSuccess:function(data){
$(this).datagrid('reloadFooter', [{
? ? ? ? ? ? ? ??heJi:'合計',
? ? ? ? ? ? ? ??tNo:compute(data.rows, "tNo"),
? ? ? ? ? ? ??? ? ? ? ? workhour:compute(data.rows, "workhour"),
? ? ? ? ? ? ? ??pay:compute(data.rows, "pay"),
? ? ? ? ? ? }]);
? ? ? ? ?},
? ??//定義合計函數(shù)
? ??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行對應(yīng)列要顯示的內(nèi)容,如合計后的內(nèi)容,可以加一個標(biāo)識如footer,用于標(biāo)明改行是footer內(nèi)容,在formatter時可能會用到
? ? $footer=array(array('heJi'=>'合計','tNo'=>$tNo,'workhour'=>$workhour,'pay'=>$pay,'footer'=>1));
//返回數(shù)據(jù)中以footer為鍵值
? ? echo json_encode(array('code'=>1,'msg'=>'查詢成功','total'=>count($rows),'rows'=>$rows,'footer'=>$footer));
? ??
? ??注:footer行的顯示同樣受formatter影響
七、獲得當(dāng)前選中的tabs
?
1、?var?index=$('#tabs').tabs('getTabIndex',$('#tabs').tabs('getSelected')); //從0開始
2、tabs的onSelect改變一個全局變量的值,用于標(biāo)記選中的tab
總結(jié)
以上是生活随笔為你收集整理的easyui 一些小技巧的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
 
                            
                        - 上一篇: ASCII,UTF-8,GBK编码简介
- 下一篇: vue项目中使用 ttf字体
