先看效果图
代码如下：
1 /* 2 2017-5-8 dbaylu 3 hi@dbay.cn 4 */ 5 (function ($, undefined) { 6 //search:false 则当前列不起用 7 $.fn.gridFilter = function( arg ) { 8 if (typeof arg === 'string') { 9 var fn = $.fn.gridFilter[arg]; 10 if (!fn) { 11 throw ("gridFilter - No such method: " + arg); 12 } 13 var args = $.makeArray(arguments).slice(1); 14 return fn.apply(this,args); 15 } 16 17 var extendedOptions={ 18 gridfilterRules: [] 19 }; 20 $.extend($.fn.datagrid.defaults, extendedOptions); 21 22 var p = $.extend(true,{ 23 name:null, 24 gridid:null, 25 columns:[], 26 single:false,//为TURE只允许单选 27 combobox:{width:90,panelHeight:'auto'}, 28 dialog:{ 29 title:'高级搜索', 30 dialogid:'dbaysearch', 31 iconCls: "icon-search", 32 saveButtonIconCls:"icon-search", 33 width: 540, 34 height: 200, 35 topMost: false, 36 nableCloseButton: false, 37 collapsible:true, 38 resizable:true, 39 modal:false, 40 saveButtonText: "搜索", 41 onSave:function (d){ 42 var ds = d.form("validate"), 43 iClose = false; 44 if (ds) { 45 46 var va=d.form("getData",{transcript: "jsonarray"}); 47 //防止和easyui-filter插件冲突 48 if($('#'+p.gridid)[p.name]('options').enablefilter){ 49 $('#'+p.gridid)[p.name]('resize',{filterRules:va}); 50 $('#'+p.gridid)[p.name]('resize',{gridfilterRules:va}); 51 $('#'+p.gridid)[p.name]('load'); 52 }else{ 53 $('#'+p.gridid)[p.name]('resize',{gridfilterRules:va}); 54 $('#'+p.gridid)[p.name]('load',{filterRules:JSON.stringify(va)}); 55 } 56 57 } 58 return false; 59 } 60 }, 61 groupOp:[{field:'and',title:'并且',selected:true},{field:'or',title:'或者'}], 62 op:{ 63 combobox:[{value:'equal',text:'等于( = )',selected:true},{value:'notequal',text:'不等于( <> )'}], 64 datebox:[{value:'equal',text:'等于( = )',selected:true},{value:'notequal',text:'不等于( <> )'},{value:'less',text:'小于( < )'},{value:'lessorequal',text:'小于等于( <= )'},{value:'greater',text:'大于( > )'},{value:'greaterorequal',text:'大于等于( >= )'}], 65 numberbox:[{value:'equal',text:'等于( = )',selected:true},{value:'notequal',text:'不等于( <> )'},{value:'less',text:'小于( < )'},{value:'lessorequal',text:'小于等于( <= )'},{value:'greater',text:'大于( > )'},{value:'greaterorequal',text:'大于等于( >= )'}], 66 textbox:[{value:'contains',text:'包含',selected:true},{value:'equal',text:'等于( = )'},{value:'notequal',text:'不等于( <> )'},{value:'beginwith',text:'以…开头'},{value:'endwith',text:'以…结尾'}], 67 monthbox:[{value:'equal',text:'等于( = )',selected:true},{value:'notequal',text:'不等于( <> )'},{value:'less',text:'小于( < )'},{value:'lessorequal',text:'小于等于( <= )'},{value:'greater',text:'大于( > )'},{value:'greaterorequal',text:'大于等于( >= )'}] 68 } 69 }, arg || {}); 70 return this.each( function() { 71 //this.p = p; 72 if (p.name === null || p.name === undefined) { 73 p.name=dbay.gridName('#'+p.gridid); 74 } 75 p.columns=$.array.filter($('#'+p.gridid)[p.name]("getColumns", "all"), function (val) { return val.field && val.title&&val.search!=false ? true : false; }); 76 var i, len = p.columns.length, cl; 77 if( !len ) {return;} 78 var table = $("<table class='group' style='border:0px none;'><tbody></tbody></table>"),tr = $("<tr></tr>"); 79 this.reDraw = function() { 80 if(p.single){$.messager.alert('只允许进行单项搜索');return;} 81 var t = this.createTableRowForRule(p); 82 table.append(t); 83 }; 84 this.createTableRowForRule = function(group,table,parentgroup) { 85 var that=this, tr = $("<tr></tr>"),i, op, trpar, cm, str="", selected; 86 tr.append("<td class='first'></td>"); 87 var ruleFieldTd = $("<td class='columns'></td>"); 88 tr.append(ruleFieldTd); 89 var ruleFieldSelect = $("<select name='field'></select>"); 90 ruleFieldTd.append(ruleFieldSelect); 91 var texts=$("<input type=\"hidden\" name=\"text\"/>"); 92 var ruleGx = $("<input type=\"hidden\" name=\"alias\"/>"); 93 ruleFieldTd.append(texts); 94 95 var ruleOperatorTd = $("<td class='operators'></td>"); 96 tr.append(ruleOperatorTd); 97 var ruleOperatorSelect = $("<select name='op'></select>"); 98 ruleOperatorTd.append(ruleOperatorSelect) 99 100 ruleOperatorSelect.combobox($.extend(true,p.combobox,{data:group.op.textbox})); 101 102 var ruleDataTd = $("<td class='data'></td>"); 103 tr.append(ruleDataTd); 104 var ruleFieldvalue=$("<input type=\"text\" class=\"easyui-validatebox\" name=\"value\">"); 105 ruleDataTd.append(ruleFieldvalue); 106 ruleFieldvalue.textbox({width:140,required:true}); 107 var tdruleGx=$("<td></td>"); 108 tr.append(tdruleGx); 109 tdruleGx.append(ruleGx); 110 if (parentgroup !== null) { 111 var gxSelect = $("<select name='groupop'></select>"); 112 tdruleGx.append(gxSelect); 113 gxSelect.combobox({width:60,panelHeight:'auto',valueField: "field", textField: "title", data:group.groupOp}); 114 }else{ 115 var gxSelect = $("<input type=\"hidden\" name=\"groupop\"/>"); 116 tdruleGx.append(gxSelect); 117 } 118 var rulebutton = $("<td></td>"); 119 tr.append(rulebutton); 120 var inputAddRule = $("<input type='button' value='+' title='Add rule'/>") 121 inputAddRule.bind('click',function(){ 122 that.reDraw() 123 }); 124 rulebutton.append(inputAddRule) 125 if (parentgroup !== null) { // ignore the first group 126 var inputDeleteGroup = $("<input type='button' value='-' title='Delete group'/>"); 127 rulebutton.append(inputDeleteGroup); 128 inputDeleteGroup.bind('click',function() { 129 tr.remove(); 130 return false; 131 }); 132 } 133 ruleFieldSelect.combobox({editable:false,width:120,panelHeight:'auto',panelMaxHeight:150,required:true,valueField: "field", textField: "title", data:group.columns,onSelect:function(obj){ 134 var type='textbox',option={},alias=''; 135 if($.type(obj.hfilter) == "object"){ 136 type=obj.hfilter.type; 137 option=obj.hfilter.options; 138 alias=obj.hfilter.alias 139 } 140 texts.val(type); 141 ruleGx.val(alias); 142 var name=dbay.textName(ruleFieldvalue); 143 if(type==name&&type=='textbox'){ 144 ruleFieldvalue[name]($.extend({},option)); 145 return false; 146 } 147 ruleFieldvalue[name]("destroy"); 148 ruleFieldvalue=$("<input type=\"text\" class=\"easyui-validatebox\" name=\"value\">"); 149 ruleDataTd.append(ruleFieldvalue); 150 switch (type){ 151 case 'datebox':case 'datetimebox': 152 ruleOperatorSelect.combobox('loadData',group.op.datebox); 153 ruleFieldvalue[type]($.extend({width:140,required:true,editable:false,prompt:'请选择日期'},option));//默认不可编辑 154 break; 155 case 'monthbox': 156 ruleOperatorSelect.combobox('loadData',group.op.monthbox); 157 ruleFieldvalue.monthbox($.extend({width:140,required:true,editable:false,prompt:'请选择月份'},option));//默认不可编辑 158 break; 159 case "combobox": 160 ruleOperatorSelect.combobox('loadData',group.op.combobox); 161 ruleFieldvalue.combobox($.extend({width:140,required:true,editable:false,panelHeight:'auto'},option)); //默认不可编辑 162 break; 163 case "numberbox": 164 ruleOperatorSelect.combobox('loadData',group.op.numberbox); 165 ruleFieldvalue.numberbox($.extend({width:140,required:true,prompt:'只能输入数字'},option)); 166 break; 167 case "combotree": 168 ruleOperatorSelect.combobox('loadData',group.op.combobox); 169 ruleFieldvalue.combotree($.extend({width:140,required:true,editable:false,panelHeight:'auto'},option)); //默认不可编辑 170 break; 171 default: 172 ruleOperatorSelect.combobox('loadData',group.op.textbox); 173 ruleFieldvalue.textbox($.extend({width:140,required:true},option)); 174 break; 175 } 176 }}); 177 return tr; 178 }; 179 table.append(tr); 180 var th = $("<th colspan='5'></th>"); 181 tr.append(th); 182 table.append(this.createTableRowForRule(p,this,null)); 183 var showDialog= $.extend({},p.dialog,{content:table}) 184 $.easyui.showDialog(showDialog);//打开窗口 185 }) 186 } 187 })(jQuery);
扫一扫
342
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
