zoukankan      html  css  js  c++  java
  • 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',
                     100
                }, {
                    field: "be_post",
                    title: "专家职称",
                    align: 'left',
                     200
    
                }, {
                    field: "dt_id",
                    title: "所属科室",
                    align: 'center',
                     100,
                    formatter: function (value, row) {
                        return formatterDepartment(value)
                    }
                }, {
                    field: "be_intro",
                    title: "专家简介",
                    align: 'left',
                     450
                }, {
                    field: "be_order",
                    title: "排序ID",
                    align: 'center',
                     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>
    

      

    <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") });   //点击搜索
                });

  • 相关阅读:
    java的(PO,VO,TO,BO,DAO,POJO)类名包名解释
    职业规划
    linux定时执行工具crontab 详解
    Apache Commons 工具类介绍及简单使用
    WebApi返回类型设置为json的三种方法
    ASP.net Web API综合示例
    C#进阶系列——WebApi异常处理解决方案
    C#进阶系列——WebApi接口返回值类型详解
    C#进阶系列——WebApi 身份认证解决方案:Basic基础认证
    •C#进阶系列——WebApi接口测试工具:WebApiTestClient
  • 原文地址:https://www.cnblogs.com/msbbc/p/3142209.html
Copyright © 2011-2022 走看看