后台传list到前台,前台怎么解析,怎么将解析的数据填充到已经存在列名table中

需求背景:
mybatis如何直接 执行传入的任意sql语句 并按照顺序取出查询的结果集 ,并将数据传输到前台,并渲染到已经存在列名的table的对应字段中


特别需要注意的是这种需求和往常的不一样,平时的都是直接传一些属性值到dao.xml文件中 在xml中进行接收,拼接sql语句。

往常的编写过程如下:

XXXService.java

	public SqlConfig getSqlConfigByTitle(String sqlTitle) {
		// TODO Auto-generated method stub
		return sqlConfigurationDao.getSqlConfigByTitle(sqlTitle);
	}

  

 XXXDao.java

	public SqlConfig getSqlConfigByTitle(String sqlTitle);

XXXDao.xml

<select id="getSqlConfigBySQLVersion" resultMap="resultMap">

select * from cf_sql s
where s.sqlVersion=#{sqlVersion}
</select>

  

我的这种需求是:在已经存在的一个表中查寻出已经存在的sql,之后通过service层 的某个方法传输到Dao.java 的某个方法中,之后再在Dao.xml中通过#{....}进行sql拼接,查出的数据多条记录,对于每一条记录都是由多个属性组成,但是如果sql语句不同的话,查询出的字段的数目也不一样,所以这里就不好通过resultTMap去映射了,因为一般resultMap会在Dao.xml中进行bean属性值和数据库列值的映射

此情景中的解决办法:

Dao.xml

<select id="superManagerSelect" parameterType="String" resultType="java.util.LinkedHashMap">
${value}
</select>

具体的为什么用resultType="java.util.LinkedHashMap"  可见另一篇博文:https://www.cnblogs.com/isme-zjh/p/12809477.html

Dao.java

    public List<LinkedHashMap<String, Object>> superManagerSelect(String value);

Service.java

public List<LinkedHashMap<String, Object>> superManagerSelect(String sqlContext) {
		// TODO Auto-generated method stub
		return sqlConfigurationDao.superManagerSelect(sqlContext);
	}
	

  Controller.java

注意控制器里面的处理:

  List<String> dataList =new ArrayList<String>();
  dataList.add(linkedHashMap.values().toString());将LinkedHashMap<String, Object> 
dataList

中的内容一项一项的输出的结果如下(Console栏中输出):
[id,name,sex][001,zhangsan1,男]
[id,name,sex][002,zhangsan2,女]
[id,name,sex][003,zhangsan3,男]
[id,name,sex][004,zhangsan4,男]

    @ResponseBody
    @RequestMapping(value="dataSelect")
    public List<String> dataSelect(@RequestParam("sqlId")String sqlId) {
        System.out.println("==========sqlId==========>"+sqlId);
        List<String> dataList =new ArrayList<String>();
        
        if((!sqlId.equals(""))&&(!(sqlId==null))){  //注意字符串中的 判空操作
            SqlConfig    sqlc = SqlConfigService.getSqlConfigById(sqlId);
            String sqlContext =     sqlc.getSqlContext();
            //测试LinkedHashMap
            
            result = SqlConfigService.superManagerSelect(sqlContext);
            for (LinkedHashMap<String, Object> linkedHashMap : result) {
                dataList.add(linkedHashMap.values().toString());
            }
            
            for (String item : dataList) {
                System.out.println("$$$====>"+item);
            }

    } 
        return dataList;
    }

前台html   代码

<script>


var sqlId = $("#sqlId").val();
			$.ajax({
				type: 'post',
				url: '${ctx}/sys/dataSelect',
				data:{"sqlId":sqlId},
				dataType: 'json',
				success: function(data){
					if(data!=null){
						var array = eval(data);
						var con="";                                此段代码是在已经有列名的table中填充数据了!
						$.each(array,function(index,item){
							var str1 =item.replace("[","");
							var str2 =str1.replace("]","");
							//alert(str2);
							var arr = str2.split(',');
							con += "<tr>";
							for(var i=0;i<arr.length;i++){
							con+="<td>"+arr[i];
							con+="</td>";
							}
							con+="</tr>";
						})
						
						$("#myBody").html(con);
					}else{
						
					}
				}
			});
</script>

  




<table id="contentTable" class="table table-striped table-bordered table-condensed"> <thead> <tr> <c:forEach items="${ls}" var="item"> <!-- 这是要填充列名称的位置-->
<th>${item}</th> </c:forEach> </tr> </thead> <tbody id="myBody"> <!-- 这是要填充数据的位置--> </tbody> </table>

这就是这种特殊情况的解决办法!

最终的效果是:

通过点击调用不同的sql会从数据库中查询出来 不同的数据通过js  填充到已经提前的渲染出列名的table中

效果如图:

var sqlId = $("#sqlId").val();$.ajax({type: 'post',url: '${ctx}/sys/dataSelect',data:{"sqlId":sqlId},dataType: 'json',success: function(data){if(data!=null){var array = eval(data);var con="";$.each(array,function(index,item){var str1 =item.replace("[","");var str2 =str1.replace("]","");//alert(str2);var arr = str2.split(',');con += "<tr>";for(var i=0;i<arr.length;i++){con+="<td>"+arr[i];con+="</td>";}con+="</tr>";})//alert(con);$("#myBody").html(con);}else{}}});

原文地址:https://www.cnblogs.com/isme-zjh/p/12809543.html