EasyUI使用記錄

==========================EasyUI使用總結=======================
1.彈出框設置標題

$("#win").dialog({'title': '修改'}).dialog('open');
$('#win').dialog('open').dialog('setTitle', '修改系統');

2.下拉框設值

$('#status').combobox('setValue', '00');

3.表單不可編輯

editable="false" 或者 readonly="true"

4.數據網格行適應寬度,防止水平滾動條

fitColumns: true

5.表單校驗

data-options="validType:'myEmail'"

6.窗口遮罩

modal="true"

7.下拉樹設值默認值

$('#' + arr[i]).combotree({
            url: 'deptorg/searchOrgTree.do?node=3401000000000000',
            idFiled:"businessId",
            textFiled:"orgName",
            parentField:"pid",
            value: org_Id,
        })

8.easyui分頁欄

var p = $('#dg').datagrid('getPager');
    $(p).pagination({
        pageSize: 20,//每頁顯示的記錄條數,默認爲10
        pageList: [20, 40, 60, 80],//可以設置每頁記錄條數的列表
        beforePageText: '第',//頁數文本框前顯示的漢字
        afterPageText: '頁    共 {pages} 頁',
        displayMsg: '當前顯示 {from} - {to} 條記錄   共 {total} 條記錄',
    });

9.水平垂直居中

vertical-align:middle;
text-align:center;
display: table-cell;

10.easyUI去除滾動條

#在有滾動條的div中添加 
style="overflow: hidden"

11.easyUItree取消層疊選中

cascadeCheck:false,
// 點擊父節點,選中子節點(改造tree,可以只選擇父節點)
            onCheck:function(node, checked){
                var childList = $(this).tree('getChildren',node.target);
                if(childList.length>0){
                    // 節點被勾選
                    var checkedTrue = function(){
                        childList.map(function(currentValue){
                            $('#'+currentValue.domId).find(".tree-checkbox").removeClass("tree-checkbox0").addClass("tree-checkbox1");
                        })
                    };
                    // 節點取消勾選
                    var checkedFalse = function(){
                        $.each(childList,function(index,currentValue){
                            $('#'+currentValue.domId).find(".tree-checkbox").removeClass("tree-checkbox1").addClass("tree-checkbox0");
                        })
                    };
                    // 判斷是否爲checked
                    var checkChangeProperties = checked==true ? checkedTrue() : checkedFalse();
                }
            }
        })

12.複選框只讀:

1.$(this).attr("disabled","disabled");
2.onClick="return false"
3.動態加載時:$(this).click(function (e) {
    e.preventDefault();
 });


13.數據網格中鼠標移動事件

onLoadSuccess: function (data) {
            $("tr").bind("mouseover", function () {
                $(this).css("color", "red");
            })
            $("tr").bind("mouseout", function () {
                $(this).css("color", "black");
            })
        }

14.數據網格加載對數據處理

rowStyler: function(index,row){
            var currentDate = new Date().getTime();
            var startDate = new Date(row.startTime).getTime();
            var day = (currentDate-startDate)/(24*60*60*1000);
            if (day > 15){
                return 'color:red;font-weight:bold;';
            }
        }

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章