EasyUI 的常用方法

来源：互联网发布：西安白队长知乎编辑：程序博客网时间：2024/05/17 08:28

1. 弹出提示框：

function show_Alert(msg) {    $.messager.show({        title: '提示',        msg: msg    });}

2. 弹出页面方法：

   其中 ShowPage   为当前页面的一个DIV ID;

function showWindow(options) {    jQuery("#ShowPage").window(options);}
showWindow({    title: titleStr,    href: hrefStr,    width: 500,    height: 400,    top: 0,    onLoad: function () {
        // 加载当前页面后执行的事件        $("#Sel_ProductIDEdit").combobox({            onSelect: function (p) {                change_product(p.value, pageID)            }        });        change_product($("#Sel_ProductIDEdit").val(), pageID)    }});
3. Table 列表小实例：

  /*页面加载数据*/    $('#Table_PageDataList').datagrid({        title: '页面管理列表',        iconCls: 'icon-edit',//图标        width: '100%',        height: 370,        nowrap: false,//设置为true，当数据长度超出列宽时将会自动截取        striped: true,//设置为true将交替显示行背景。        border: true,        collapsible: true,//是否可折叠的        fit: true,//自动大小        url: '/sys/selectPageManageDataPage.do',        //sortName: 'RoleName',        //sortOrder: 'desc',        remoteSort: false,        idField: 'fldId',        singleSelect: true,//是否单选        pagination: true,//分页控件        rownumbers: true,//行号        onLoadSuccess: function () {            $('#list_data').datagrid('clearSelections'); //一定要加上这一句，要不然datagrid会记住之前的选择状态，删除时会出问题        }//        ,//        frozenColumns: [[//            {field: 'ck', checkbox: true}//        ]]//        ,//        onClickRow: function (rowindex, rowData) {//            var PageID = rowData.pageid;//            openDialog('ShowPage', 'Edit', PageID);//        }//        ,//        toolbar: [{//            text: '添加',//            iconCls: 'icon-add',//            handler: function () {//                openDialog("ShowPage", "Add", "");//            }//        }, '-', {//            text: '修改',//            iconCls: 'icon-edit',//            handler: function () {//                pageID = SelectRows.pageid;//                openDialog("ShowPage", "Edit", pageID);//            }//        }, '-', {//            text: '删除',//            iconCls: 'icon-remove',//            handler: function () {//                var SelectRows = $("#Table_PageDataList").datagrid("getSelected");//                var pageID = SelectRows.pageid;//                DeleteSysPage(pageID);//            }//        }]//        }]    });    //设置分页控件    var p = $('#Table_PageDataList').datagrid('getPager');    $(p).pagination({        pageSize: 10,//每页显示的记录条数，默认为10        pageList: [5, 10, 20, 30, 40, 50, 100, 500],//可以设置每页记录条数的列表        beforePageText: '第',//页数文本框前显示的汉字        afterPageText: '页    共 {pages} 页',        displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录',        /*onBeforeRefresh:function(){         $(this).pagination('loading');         alert('before refresh');         $(this).pagination('loaded');         }*/    });
3.2 Table Html:
<div style="height:390px" id="datadiv" class="z_table">    <table id="Table_PageDataList">        <thead>        <tr>            <th field="pagename" width="10%">页面名称</th>            <th field="pname" width="10%">产品名称</th>            <th field="pageurl" width="10%">页面URL</th>            <th field="priority" width="5%">页面顺序</th>            <th field="isenabled" formatter="isEnabledstr" width="5%">是否禁用</th>            <th field="isdeleted" formatter="isdeletedstr" width="5%">是否删除</th>            <th field="modulenames" width="25%">所属模块</th>            <th field="pageid" formatter="operatestr" width="15%">操作</th>        </tr>        </thead>    </table></div>
 其中：formatter 属性 对应的是JS 方法名称 可以编辑该列内容如：添加操作按钮,单选框 等。
4. 查询方法：

/*查询*/function doSearch() {
    // Table_PageDataList ---tableID    //$("#Sel_ProductID").combobox('getValue')    $('#Table_PageDataList').datagrid('load', {        PageName: $('#txt_PageName').val(),        PageUrl: $('#txt_PageUrl').val(),        ProductId: $("#Sel_ProductID  option:selected").val()    });}

0 0