优化jeecg底层高级查询,支持bool值和下拉框查询

最近在用jeecg做项目,在使用高级查询的时候发现它不支持布尔值的查询以及列表的下拉框的查询,所以小编修改了底层代码,完善了高级查询,现在与大家一起分享。先上一张图给大家看一下修改前的高级查询。

它只支持了文本的查询以及日期格式的查询,很难满足在使用过程中的要求。所以小编把他的功能丰富了一下,下面把源码分享给大家。

首先先简单介绍一下jeecg高级查询的原理,一切的秘密都在DataGridTag这个标签类里面,在打开一个页面的时候,这个类会对页面的左右变迁进行初始化,以及对高级查询的页面进行构造。当你在jsp页面中对datagrid设置属性queryBuilder="true",页面中就会出现高级查询的按钮,点击高级查询,就会弹出,DataGridTag这个类在初始化是生成的高级查询的页面。先看一下生彻骨页面的源码

fieldArray.append("	[  ");
		for (int i=0;i<columnList.size();i++){
			DataGridColumn col =columnList.get(i);
			if("opt".equals(col.getField()))continue;//忽略操作虚拟字段
			if (!col.isHidden()) {
				fieldArray.append("	{‘fieldId‘:‘"+ ((col.getQueryChangeCol() != null && !col.getQueryChangeCol().equals(""))
						? col.getQueryChangeCol() : getDBFieldName(col.getField()))+"‘,‘fieldName‘:‘"+col.getTitle()+"‘");
				if(col.getEditor()!=null){
					fieldArray.append(",editor:‘"+col.getEditor()+"‘");
				}
				if(col.getReplace()!=null){
					String str = col.getReplace();
					fieldArray.append(",replaceid:‘"+str+"‘");
				}
				fieldArray.append("}");
				if(i<columnList.size()-1){
					fieldArray.append(",");
				}
			}
		}

datagrid这个表格列支持一个replace属性,例如:

<t:dgCol title="单据状态"  field="billstate" editor="combobox" hidden="false"  queryMode="single" formatter="billstateFormat"  width="120" replace="自由态_0,提交_1,审批_2"></t:dgCol>  

这是会在主界面根据不同得知,显示不同的文字,类似于表格的自定义转换,我们要在高级查询中支持下拉框和bool值也要利用这个属性。上面的代码就是就是获取到主界面忠表格所有现实的列,构造高级查询字段这一列供你查询,注意这一段代码

if(col.getReplace()!=null){
  String str = col.getReplace();
  fieldArray.append(",replaceid:‘"+str+"‘");}它的作用就是在构造你可以查询的的字段中,如果某一个列的replace属性有值,说明他在展示中进行了值得转换,同时也说明 他在高级查询中应该是一个下拉框供人选择,所以我们在构造字段列的时候不能单单构造到他的fieldId,fieldName,还要记录一下它设置的replace的值,方便你选到这个进行查询时,他会在值录入的那一列自动转换成一个下拉框,并对下拉框进行赋值。构造好这一切之后,要做的就是对高级查询的页面的treegrid的每一列进行样式的设置,这里面最重要的就是界面中字段列的下拉框的选择改变事件,让我们来看下:
appendLine(sb,"for(var i=0;i<data.length;i++){");
        appendLine(sb,"if(value == data[i][‘fieldId‘]){");
        appendLine(sb,"return data[i][‘fieldName‘];");
        appendLine(sb,"}");
        appendLine(sb,"}");
        appendLine(sb,"return value;");
        appendLine(sb,"},editor:{");
        appendLine(sb,"type:‘combobox‘,");
        appendLine(sb,"    options:{");
        appendLine(sb,"valueField:‘fieldId‘,");
        appendLine(sb,"textField:‘fieldName‘,");
        appendLine(sb,"data:  ");
        sb.append(fieldArray);
        appendLine(sb," , ");
        appendLine(sb, "required:true,onSelect : function(record) { debugger;");
        appendLine(sb,"var opts = $(‘#"+name+"tg‘).treegrid(‘getColumnOption‘,‘value‘);");
        appendLine(sb, "    if(record.editor != null && record.editor != ‘‘){");
        appendLine(sb, "            opts.editor={‘type‘:record.editor};");
        appendLine(sb, "var tr = $(this).closest(‘tr.datagrid-row‘);");
        appendLine(sb, "var index = parseInt(tr.attr(‘node-id‘));");
        appendLine(sb, " $($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target).val(‘‘);");
        appendLine(sb, " $($($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target).next().find(‘input‘)[1]).val(‘‘);");
        appendLine(sb, "    $(‘#"+name+"tg‘).treegrid(‘endEdit‘, index);");
        appendLine(sb, "    $(‘#"+name+"tg‘).treegrid(‘beginEdit‘, index);");
        appendLine(sb, "    var arrayList = [];  ");
        appendLine(sb, "    if (record.replaceid != null) {var jsonid = record.replaceid;");
        appendLine(sb, "    var idList = jsonid.split(‘,‘);");
        appendLine(sb, "            if (opts.editor.type == ‘combobox‘){ ");
        appendLine(sb, "$.each(idList,function(i,n){");
        appendLine(sb, "var obj={};");
        appendLine(sb, "var namelist=n.split(‘_‘);");
        appendLine(sb, "obj[‘relationId‘]=namelist[1];");
        appendLine(sb, "obj[‘relationName‘]=namelist[0];");
        appendLine(sb," if(namelist[2] != null){");
        appendLine(sb," obj[‘ifnull‘]=namelist[2]}");
        appendLine(sb, "arrayList.push(obj);");
        appendLine(sb,  "}); ");
        appendLine(sb,  "$($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target).combobox({");
        appendLine(sb,      " valueField:‘relationId‘,");
        appendLine(sb,     "textField:‘relationName‘ ");
        appendLine(sb,    " })");
        appendLine(sb,  "$($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target).combobox(‘loadData‘,arrayList);$($($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target).next().find(‘input‘)[0]).css(‘width‘,‘70px‘);");
        appendLine(sb, "if(arrayMap==null){arrayMap = {};};arrayMap[record.fieldId]=arrayList;}}");
        appendLine(sb, "else{");
        appendLine(sb, "opts.editor={‘type‘:record.editor,option:{ valueField:‘relationId‘,  textField:‘relationName‘ ,required:true    }}}");
        appendLine(sb, "    }else{");
        appendLine(sb, "            opts.editor=‘text‘;");
        appendLine(sb, "var tr = $(this).closest(‘tr.datagrid-row‘);");
        appendLine(sb, "var index = parseInt(tr.attr(‘node-id‘));");

        appendLine(sb, "            $($($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target).next().find(‘input‘)[1]).val(‘‘);");

        appendLine(sb, "    $(‘#"+name+"tg‘).treegrid(‘endEdit‘, index);");
        appendLine(sb, "    $(‘#"+name+"tg‘).treegrid(‘beginEdit‘, index);");
        appendLine(sb, "    }");
        appendLine(sb, "}");
        appendLine(sb,"                }}\">字段</th>");

关键的就是上面的代码中表蓝色的部分,他就是字段列下拉框的改变事件,先看一下我调整后的效果

我们来分析一下代码,
var opts = $(‘#"+name+"tg‘).treegrid(‘getColumnOption‘,‘value‘);//获取到所选的字段这一行列标题为值得这一列的属性对象然后他会去获取你在主界面列展示中地这个属性设置的editor的值,然后赋给value这一列,其实也就是把设置好的类型赋值给他,例如: <t:dgCol title="单据状态"  field="billstate" editor="combobox" hidden="false"  queryMode="single" formatter="billstateFormat"  width="120" replace="自由态_0,提交_1,审批_2"></t:dgCol>你设置了editor="combobox"那么你在高级查询界面选择了单据转改进行查询,相应的它的值那一列就会变成下拉框。下面就是给值得下拉框赋值的问题了,
if (record.replaceid != null) {    var jsonid = record.replaceid;//之前在构造字段列的时候会记录每一个字段是否有replace值,如果有,先获取到它的replace值,例如:replace="自由态_0,提交_1,审批_2"
     var idList = jsonid.split(‘,‘);
     if (opts.editor.type == ‘combobox‘){
        $.each(idList,function(i,n){//根据逗号分隔的数组,进行对下拉框数据源进行组装
        var obj={};
        var namelist=n.split(‘_‘);
        obj[‘relationId‘]=namelist[1];//下拉框隐藏的id
        obj[‘relationName‘]=namelist[0];//下拉框现实的text
        if(namelist[2] != null){
        obj[‘ifnull‘]=namelist[2]}//ifnull这个是方便数据哭某些表的integer的类型的字段忘记选中分空,所以会出现一些数据为空的情况,你也可以根据replace属性的设置,对空值转换
        arrayList.push(obj);
        });
        $($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target).combobox({//制定下拉框的属性对应数据源的属性
        valueField:‘relationId‘,
        textField:‘relationName‘
        })
        $($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target).combobox(‘loadData‘,arrayList);$($($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target).next().find(‘input‘)[0]).css(‘width‘,‘70px‘);//对下拉框进行数据源的绑定,注意在获取下拉框的时候一定要像这样$($(‘#"+name+"tg‘).treegrid(‘getEditors‘, index)[3].target)获取到他下拉框的combobox控件进行时间绑定,否则数据是绑定不了的。
        if(arrayMap==null){arrayMap = {};};       arrayMap[record.fieldId]=arrayList;//大家注意这一行代码是要记录这一个字段对应的下拉框的数据源,方便下拉框选择了值之后,将下拉框的valueField转成textField。以及当你第二次打开高级查询时,查询历史的查询记录,同样也要根据这个将下拉框的值进行转换,非常重要。     }}下面就涉及到了高级查询界面的确定按钮,先看一下代码
appendLine(sb, "function queryBuilderSearch() { ");
        appendLine(sb, "         var json =  view();");
        appendLine(sb, "    $(‘#_sqlbuilder‘).val(json);  ");
        appendLine(sb, "    var isnew=true; ");
        appendLine(sb, "for(var i=0;i< "+name+"his.length;i++){");
        appendLine(sb, "    if("+name+"his[i]&&"+name+"his[i].json==json){");
        appendLine(sb, "        isnew=false;");
        appendLine(sb, "    }");
        appendLine(sb, "}");
        appendLine(sb, "if(isnew && json!=‘[]‘){");
        appendLine(sb, " "+name+"his.push({name:‘Query‘+"+name+"his.length,json:json});saveHistory();");
        appendLine(sb, "var name= ‘Query‘+( "+name+"his.length-1);");
        appendLine(sb, "    var name= ‘Query‘+("+name+"his.length-1);");
        appendLine(sb, "appendTree("+name+"his.length-1,name);");
        appendLine(sb, "}");
        appendLine(sb, "        var t = $(‘#" + name + "tg‘);");
        appendLine(sb, "        var data = t.treegrid(‘loadData‘,[]);");
        appendLine(sb, "    " + name + "search();$(‘#_sqlbuilder‘).val(‘‘);$(‘#"+name+"_qbwin‘).window(‘close‘)");
        appendLine(sb, " }");
appendLine(sb, "function view(){");
        appendLine(sb,"save();");
        appendLine(sb,"var t = $(‘#"+name+"tg‘);");
        appendLine(sb,"var data = t.treegrid(‘getData‘);");
        //// 增加布尔类型的值.
        appendLine(sb,"for (var i = 0; i < data.length; i++) {      if(jQuery.isEmptyObject(arrayMap)){arrayMap=storage.get(‘arrayMap‘);}");//因为我们下拉框的数据源会进行缓存,所以第二次进入高级查询时,map会是空的,我们要去缓存中 获取之前的map数据
        appendLine(sb," if (arrayMap != null){var list = arrayMap[data[i].field];if (list != null){");
        appendLine(sb," if(data[i].rember == null || data[i].rember==‘‘){$.each(list,function(j,n){");
        appendLine(sb," if(n.relationId==data[i].value){");
        appendLine(sb," data[i].rember=data[i].value;if(n.ifnull != null){data[i].ifnull = n.ifnull;};data[i].replace = n.relationName;");//在要缓存的记录数据中增加replace属性,记录下拉框值对应的文本显示
        appendLine(sb, " }})} else{data[i].value=data[i].rember;}}} ");
        appendLine(sb," }");
        //// 增加布尔类型的值。
        appendLine(sb,"return   JSON.stringify(data) ;");
appendLine(sb,"function save(){");
        appendLine(sb,"    var t = $(‘#"+name+"tg‘);");
        appendLine(sb,"    var nodes = t.treegrid(‘getData‘);");
        appendLine(sb,"    for (var i = 0; i < nodes.length; i++) {");
        appendLine(sb,"    t.treegrid(‘endEdit‘,nodes[i].id);} ");
        appendLine(sb,"    for (var i = 0; i < nodes.length; i++) {");
        appendLine(sb," if(jQuery.isEmptyObject(arrayMap)){arrayMap=storage.get(‘arrayMap‘);} if (arrayMap != null) {var list = arrayMap[nodes[i].field];if (list != null){");
        appendLine(sb, " $.each(list,function(j,n){t.treegrid(‘beginEdit‘,nodes[i].id);");
        appendLine(sb," if(n.relationId==nodes[i].value){");
        appendLine(sb," nodes[i].replace = n.relationName; nodes[i].rember = n.relationId;if(n.ifnull != null){nodes[i].ifnull = n.ifnull;}; nodes[i].value = nodes[i].replace;}");
        appendLine(sb, " t.treegrid(‘update‘,{id:nodes[i].id,row:nodes[i]})})}}" );
        appendLine(sb,"    } ");
        appendLine(sb,"saveHistory();storage.set(‘arrayMap‘,JSON.stringify(arrayMap));");//缓存字段的下拉框的数据源
        appendLine(sb,"    }");

重要的就是对这三个js方法进行修改,下面一次为大家讲解这三个方法:

view()方法主要是对查询界面的treegrid的数据进行一下加工,因为查询的记录会被缓存,而传到服务端的只会是下拉框的value,以方便再次查看,所以我们要在缓存的数据中增加一些属性,例如要记录下拉框选中的值对应的text文本,方便再次查看时进行转换。

save()方法和view方法构造数据的方式相差不多,s它的主要作用就是构造好数据,然后保存这次查询到记录中。

好了,修改过后的js,他会记录你所需要的数据,方便你之后的使用和查询时的数据转换。开源的平台的好处就是我们可以随意的改造,添加自己的想法,如果对高级查询这块有什么想法要和我交流讨论或者想要完整源码的可以加这个QQ:2672773684,写明备注就可以了。
时间: 2024-12-28 22:53:43

优化jeecg底层高级查询,支持bool值和下拉框查询的相关文章

PHP文本框的值随下拉框改变

初学PHP,下面是实现文本框内容随下拉框变化的代码实现: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m

封装下拉框控件!将查询到信息塞到下拉框中,将所选的内容截取并显示到静态框(联动显示)

1 int CSetOrgan::GetAllArea(CString& operArea) 2 { 3 CString strTemp; 4 for(int i=0; i<m_cmbDept.GetCount(); i++) 5 { 6 m_cmbDept.DeleteString(i); 7 } 8 this->PrepareReqPack(TX_QUERYORGAN); 9 AddField((getUIData().getUserId()), sorder0, F_SORDER

thinkphp怎么把数据库中的列的值存到下拉框中

1. 先去数据库中查值,查询整个数据表,结果为二维数组. $project = M("project"); $cell = $project->where(array('status'=>1))->order("id desc")->select(); //var_dump($cell); $this->assign('cell',$cell); 2.前台获取遍历 <select class="test" st

ASP.NET MVC搭建项目后台UI框架—11、自动加载下拉框查询

ASP.NET MVC搭建项目后台UI框架—1.后台主框架 需求:在查询记录的时候,输入第一个字,就自动把以这个字开头的相关记录查找出来,输入2个字就过滤以这两个子开头的记录,依次类推. 突然要用到这个功能了,印象中曾经写过这个功能的文章,一下子找不到了,只好重新贴出来备忘.最近博客快2个月没更新了,因为这两个月一直在闭门写书. 引入js和css下载地址:http://download.csdn.net/detail/zouyujie1127/9550279 <link href="~/l

下拉框设定选择的值

if (下拉框.Items.FindByValue(设定的Value值) != null) { 下拉框.SelectedIndex = 下拉框.Items.IndexOf(下拉框.Items.FindByValue(设定的Value值)); } if (下拉框.Items.FindByText(设定的Text值) != null) { 下拉框.SelectedIndex = 下拉框.Items.IndexOf(下拉框.Items.FindByText(设定的Text值)); }

Java Swing应用程序 JComboBox下拉框联动查询

在web项目中,通过下拉框.JQuery和ajax可以实现下拉框联动查询. 譬如说,当你查询某个地方时,页面上有:省份:<下拉框省份> 市区:<下拉框市区> 县乡:<下拉框县乡> 街道:<街道下拉框> 查询 譬如说,你选择了省:江苏省,那么在市区中只会显示江苏省的市区 譬如:(网上的图) 具体详细实现可以参考,写得挺好的:http://blog.csdn.net/sinat_24491773/article/details/50810471 那么在swing

框架 day50 BOS项目 4 批量导入(ocupload插件,pinyin4J)/POI解析Excel/Combobox下拉框/分区组合条件分页查询(ajax)/分区数据导出(Excel)

知识点: 批量导入(ocupload插件,pinyin4J /POI解析Excel(apache POI) /区域分页查询 /Combobox下拉框 /分区组合条件分页查询(ajax) /分区数据导出(Excel下载) BOS项目笔记第4天 1.    区域批量导入功能 *Ajax不支持文件上传. *上传并且不刷新上传页面原理: Target到一个0,0,0的隐藏iframe里,造成一个没有刷新的假象 <form target="myIframe" action="ab

读取mysql中的特定列值放入页面的下拉框中

1.使用的技术:JSP,Spring JDBC(Mapper) 2.代码 2.1 接口 public interface IMeetingRoomDao { public List<Mrcap> selectCap(); public List<Mrfloor> selectFloor(); } 2.2 实现类 @Override public List<Mrcap> selectCap() { List<Mrcap> caplist = new Array

struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input

原文地址:struts2 jsp表单提交后保留表单中输入框中的值 下拉框select与input jsp页面 1     function dosearch() {2         if ($("#textValue").val() == "") {3                 $("#errortip").html("<font color='#FF0000'>请输入查询内容</font>")