EasyUI datagrid 多条件查询
<script type="text/javascript"> $(function () { $("#dg").datagrid({ url: '', singleSelect: true, pagination: true, pageSize: 15, pageList: [5, 10, 15, 20, 30, 50, 80, 200], queryParams: form2Json("searchform"), //关键之处 //锁定列 frozenColumns: [[{ field: 'ck', checkbox: true }, ]], columns: [[{ field: "be_id", title: "专家ID", hidden: true }, { field: "be_name", title: "专家姓名", align: 'left', width: 100 }, { field: "be_post", title: "专家职称", align: 'left', width: 200 }, { field: "dt_id", title: "所属科室", align: 'center', width: 100, formatter: function (value, row) { return formatterDepartment(value) } }, { field: "be_intro", title: "专家简介", align: 'left', width: 450 }, { field: "be_order", title: "排序ID", align: 'center', width: 100 }]], })//datagrid $("#submit_search").linkbutton({ iconCls: 'icon-search', plain: true }) .click(function () { $('#dg').datagrid({ queryParams: form2Json("searchform") }); //点击搜索 }); }) //将表单数据转为json function form2Json(id) { var arr = $("#" + id).serializeArray() var jsonStr = ""; jsonStr += '{'; for (var i = 0; i < arr.length; i++) { jsonStr += '"' + arr[i].name + '":"' + arr[i].value + '",' } jsonStr = jsonStr.substring(0, (jsonStr.length - 1)); jsonStr += '}' var json = JSON.parse(jsonStr) return json } </script>
HTML
<form name="searchform" method="post" action="" id ="searchform"> <td width="70" height="30"><strong>专家检索:</strong></td> <td height="30"> <input type="text" name="keyword" size=20 > <select name="search_type" id="search_type" > <option value="-1">请选择搜索类型</option> <option value="be_name" >按专家姓名</option> <option value="be_intro">按专家简介</option> </select> <select name="search_dept" id="search_dept"> <option value="-1">请选择所属科室</option> </select> <a id="submit_search">搜索</a> </td> </form> <table id="dg"></table>
queryParams: form2Json("searchform") 是关键,这个属性是专门用来查询的
为搜索按钮绑定click事件
$("#submit_search").click(function () {
$('#dg').datagrid({ queryParams: form2Json("searchform") }); //点击搜索
});