easyui 实现的高级查询

<table id="search">

</table>
<div id="tb">
    <a href="javascript:void(0)" onclick="add()"  class="easyui-linkbutton" iconCls="icon-add">插入条件</a>

    <a href="javascript:void(0)" onclick="del()"  class="easyui-linkbutton" iconCls="icon-del">删除条件</a>
    <a href="javascript:void(0)" onclick="delall()"  class="easyui-linkbutton" iconCls="icon-empty">清空条件</a>


</div>
<script>

    var field = {$data.field};
    var compare ={$data.compare};
    var relation={$data.relation};
    var data=[
    ];
    //格式化字段
    var _fieldnameFormater=function(value,row){
        var rets="";
        for (var i=0;i<field.length;i++){
            if (field[i].id===value){
                rets=field[i].text;
                break;
            }
        }
        return rets;
    };
    //格式化比较符显示
    var _compareFormater=function(value,row){
        var rets="";
        for (var i=0;i<compare.length;i++){
            if (compare[i].id===value){
                rets=compare[i].text;
                break;
            }
        }
        return rets;
    };
    //格式化逻辑关系
    var _relationFormater=function(value,row){
        var rets="";
        for (var i=0;i<relation.length;i++){
            if (relation[i].id===value){
                rets=relation[i].text;
                break;
            }
        }
        return rets;
    };

    //当字段combobox改变值时，动态创建值列的editor
    var _onChangeValueEditor=function(newValue, oldValue)
    {
        var editor=_getColumEditor(newValue);
        g.datagrid("removeEditor","value");
        g.datagrid("addEditor",[{field:'value',editor:editor}]);

    };
    //根据字段生成editor
    var _getColumEditor=function(fieldname){
        var type="string";
        for (var i=0;i<field.length;i++){
            if (field[i].id===fieldname){
                type=field[i].type;
                break;
            }
        }
        var retEditor={};
        switch (type)
        {
            case "int":retEditor={type:"numberspinner",options:{required:false}};break;
            case "bool":retEditor={type:"checkbox",options:{required:false}};break;
            case "date":retEditor={type:"datebox",options:{required:false}};break;
            default:retEditor={type:"textbox",options:{required:false}};
        }
        return retEditor;

    };

    _currentEditIndex=-1;
    window['g']=$('#search').datagrid({
        data:data,
        clickToEdit:true,
        method:'post',
        rownumbers: true,
        animate:true,
        collapsible: true,
        fitColumns: true,
        singleSelect:true,
        striped: true,
        remoteSort:true,
        fit:true,
        toolbar: '#tb',
        pagination:false,
        checkbox:false,
        columns:[[
            {field:'field',align:'center',title:'字段',width:200,editor:{type:'combobox',options:{data:field, valueField: 'id',textField: 'text',onChange:_onChangeValueEditor}},formatter:_fieldnameFormater},
            {field:'compare',align:'center',title:'比较符',width:220,editor:{type:'combobox',options:{data:compare, valueField: 'id',textField: 'text'}},formatter:_compareFormater},
            {field:'value',align:'center',title:'值',width:220,editor:{type:"textbox",options:{required:false}}},
            {field:'logic',align:'center',title:'逻辑关系',width:120,editor:{type:'combobox', options:{data:relation, valueField: 'id',textField: 'text'}},formatter:_relationFormater}
        ]]

    }).datagrid('enableCellEditing');


    function add() {
        g.datagrid("appendRow",{});
    }

    function del() {
        var rows=g.datagrid("getRows");

        var index=g.datagrid("getRowIndex",rows[rows.length-1]);
        g.datagrid("deleteRow",index);

    }
    
    function delall() {
        var row=g.datagrid("getRows").length;
        for (var i=row-1;i>=0;i--){
            g.datagrid('deleteRow',i);
        }
        _currentEditIndex=-1;
    }

</script>

用到的easyui扩展有 datagrid-cellediting.js 和以下代码


//扩展datagrid:动态添加删除editor
$.extend($.fn.datagrid.methods, {
    addEditor : function(jq, param) {
        if (param instanceof Array) {
            $.each(param, function(index, item) {
                var e = $(jq).datagrid('getColumnOption', item.field);
                e.editor = item.editor; });
        } else {
            var e = $(jq).datagrid('getColumnOption', param.field);
            e.editor = param.editor;
        }
    },
    removeEditor : function(jq, param) {
        if (param instanceof Array) {
            $.each(param, function(index, item) {
                var e = $(jq).datagrid('getColumnOption', item);
                e.editor = {};
            });
        } else {
            var e = $(jq).datagrid('getColumnOption', param);
            e.editor = {};
        }
    }
});

php部分

function search_func($data){
    $where=array();
    $arr=json_decode($data,true);
    foreach ($arr as $key=>$v) {
        if(array_key_exists('relation',$arr[$key]) && array_key_exists('field',$arr[$key])&& array_key_exists('value_star',$arr[$key])){

            $relation='';
            if($v['relation']!='null'){

                $relation=$v['relation'];
            }


            switch ($v['compare']) {
                case "like":
                    $where[$v["field"]]=array($v['compare'],'%'.$v['value_star'].'%',$relation);
                    break;
                case "between":

                case "not between":

                case "between time":

                case "not between time":
                    $where[$v["field"]]=array($v['compare'],[$v['value_star'],$v['value_end']],$relation);
                    break;
                case "in":

                case "not in":
                    $where[$v["field"]]=array($v['compare'],[$v['value_star']],$relation);
                    break;
                case "null":

                case "not null":
                    $where[$v["field"]]=array($v['compare'],$relation);
                    break;

                default:
                    $where[$v["field"]]=array($v['compare'],$v['value_star'],$relation);
                    break;
            }

        }


    }
    return $where;
}