5.综合案例要点

tabs动态添加选项卡,加载远程资源细节:

使用iframe标签加载资源给content

$("#myTables").tabs("add",{
    title:node.text,
    //href:nodel.url//只会引入body部分,容易出现方法冲突,id冲突等问题
    content:'<iframe src="'+node.url+'" width="100%" height="100%" frameborder="0">',
    closable:true
})

easyui中下拉框自适应高度:

加panelHeight:'auto'

easyui中下拉框选择默认值:

在json中添加selected

[
    {"name":"--请选择--","id":-1,"selected":true},
    {"name":"人事部","id":1},
    {"name":"市场部","id":2},
    {"name":"开发部","id":3},
    {"name":"小卖部","id":4}
]

easyui中提交form表单的简单方式

//不能使用ajaxfrom插件,使用from的方式
$("#emp_form").form("submit",{
    url:"employee_saveOrUpdate.json",
    success:function (data) {
        //将data字符串转换成json
        data = $.parseJSON(data);
        if (data.success) {
            
        }else {
            
        }
    }
});

清除form表单中所有数据的方法:

$("#emp_form").form("clear");

datagrid中reload和load的区别

重新加载数据,使用reload,刷新当前界面,load是刷新第一页(显示第一页数据)

处理回显的问题:

function edit() {
    //因为编辑需要选中数据
    var row = $("#emp_dg").datagrid("getSelected");
    if (!row) {//如果没有选中则提示
        $.messager.alert("温馨提示","没有选中任何员工","error");
        return;
    }

    //处理部门属性
    row["dept.id"] = row.dept.id;

    //回显数据load方法是根据同名匹配的原则(row中的属性名要和表单中的name属性名相同)
    $("#emp_form").form("load",row);

    //打开弹出框
    $("#input_dialog").dialog("open");
    //设置标题
    $("#input_dialog").dialog("setTitle","编辑员工");
}

高级查询:

$("#search").searchbox({
    prompt:"请输入电话或者姓名",
    searcher:function(value,name) {
        if (value) {
            $("#emp_dg").datagrid("load",{
                keyword:value
            });
        }
    }
});