layui数据表格与java后台数据交互

layui数据表格与java后台数据交互

jsp部分


<table class="layui-hide" id="test"
lay-filter="test"></table>

js


layui.use('table', function(){

var table = layui.table;



table.render({

elem: '#test'

,url:'http://localhost:8080/news_ssh/newsAction_news.action'

,toolbar: '#toolbarDemo'

,title: '用户数据表'

,limit: 10

,cols: [[

{type: 'checkbox', fixed: 'left'}

,{field:'id', title:'序号', width:80, fixed: 'left', unresize: true, sort: true}

,{field:'title', title:'标题', width:100}

,{field:'createTime', title:'录入时间', sort: true}

,{field:'name', title:'栏目', width:80}

,{field:'author', title:'录入者', width:120}

,{field:'source', title:'来源', width:100}

,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}

]]

,page: true

});

layui的数据来自url,layui规定url返回的数据为json格式,这就需要把java的数据转为json格式,因为json-lib-2.4-jdk15要依赖以下jar包

commons-beanutils-1.8.0.jar、commons-collections-3.2.1.jar、commons-lang-2.6.jar、commons-logging-1.1.1.jar、ezmorph-1.0.6.jar、json-lib-2.4-jdk15.jar、xom-1.2.6.jar,比较麻烦,推荐用阿里的fastjson,fastjson是国内著名的电子商务互联网公司阿里巴巴内部开发的用于java后台处理json格式数据的一个工具包,包括“序列化”和“反序列化”两部分,它具备如下特征:

1).速度最快,测试表明,fastjson具有极快的性能,超越任其他的java json parser。包括自称最快的jackson。

2).功能强大,完全支持java bean、集合、Map、日期、Enum,支持范型,支持自省。

3).无依赖,能够直接运行在Java SE 5.0以上版本

4).支持Android。

5).开源 (Apache 2.0)
我用的是fastjson-1.2.49.jar
fastJson的网址:http://code.alibabatech.com/wiki/display/FastJSON/Overview

NewsAction

public class NewsAction extends SuperAction implements ModelDriven<News> {

 public News n=new News();

 /*layui的数据表格向url发送请求时,会附上page以及limit这两个参数,
 所以服务端需要接收并以此为条件查找数据*/
 private int page=1;

 private int limit=10;

 public int getPage() {

  return page;

 }

 public void setPage(int
page) {

  this.page = page;

 }

 public int getLimit() {

  return limit;

 }

 public void setLimit(int
limit) {

  this.limit = limit;

 }

 public int TypeId=0;

 public int newsTypeId=0;

 public String news() throws Exception{

    WebApplicationContext applicationContext =
WebApplicationContextUtils

    .getWebApplicationContext(ServletActionContext.getServletContext());

  NewsDao bdao = (NewsDaoImpl)
applicationContext.getBean("newsDao");
/*queryPageNews方法的查询语句为hql="select News.id,News.title,News.createTime,nt.name,News.source,News.author from News News,NewsType nt where News.state=? and News.newsTypeId=nt.id "+
  "and News.del=0 order by News.createTime desc";因为Hibernate多表联查,所以手动将结果集转化成JSON*/
  List<Object[]>list=bdao.queryPageNews(this.getPage(), this.getLimit(), 0);

  List<NewsAndNewsType> mylist = new
LinkedList<NewsAndNewsType>();

  NewsAndNewsType nt;

  //System.out.println(list);

  for(Object[] object:list){             
  

   //System.out.println(object.length);           
 

   nt = new
NewsAndNewsType();              


   nt.setId(object[0].toString());

   nt.setTitle((String) object[1]);

   nt.setCreateTime(object[2].toString());

   nt.setName((String) object[3]);

   nt.setSource((String) object[4]);

   nt.setAuthor((String) object[5]);

   mylist.add(nt);             


   }  

  session.removeAttribute("news_list");

  //放进session中

  if(list!=null&&list.size()>0){

   session.setAttribute("news_list", list);

   Map<String, Object> result = new HashMap<String,
Object>();

      result.put("code", 0);

      result.put("msg", "");

     
result.put("count",bdao.getqueryPageNewsCount(0));

      JSONArray array = (JSONArray)
JSON.toJSON(mylist);

      result.put("data", array);

      // 将其转换为JSON数据,并压入值栈返回

     
ActionContext.getContext().getValueStack().set("jsonData",JSON.toJSON(result));

      return "success";

  }else{

   session.setAttribute("listSize",list.size());

   System.out.println("成功查询,查询条数"+list.size());

  }

  System.out.println("成功查询,查询条数"+list.size());

  return SUCCESS;

 }

 public News
getModel() {

  // TODO Auto-generated method stub

  return null;

 }

}

struts.xml配置

<package name="myNews" extends="json-default" namespace="/">
  <action name="newsAction_*" class="com.sise.web.NewsAction" method="{1}">
        <result name="success" type="json">
            <param name="root">jsonData</param>
        </result>
        </action>
 </package>

注意,struts.xml中extends="json-default"要导入jar包struts2-json-plugin-2.3.24.jar,param要为root
在这里插入图片描述

  • 1
    点赞
  • 18
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: 关于layui数据表格查询后台怎么写的问题,我可以给您一些指导性的回答。如果您使用layui数据表格,您需要编写后台代码来处理数据的查询请求。您可以使用服务器端脚本如PHP、Java、Python等编写后台代码,处理查询请求并返回符合条件的数据。您需要根据您的具体需求和数据结构设计后台代码的逻辑和查询语句。建议您在编写后台代码之前先了解layui数据表格的相关文档和示例代码,以便更好地理解和使用该插件。 ### 回答2: Layui是一款基于JavaScript的前端框架,它包含了丰富的UI组件,可以快速搭建出漂亮的界面。其中,Layui数据表格是一种常用的组件,用于展示和交互数据。 在实现Layui数据表格的查询功能时,我们需要做以下几个步骤: 1. 后台接收参数:前端传递查询条件给后台,一般使用POST方式传递,后台需要接收这些参数。可以使用框架如SpringMVC提供的注解@RequestParam来获取参数值。 2. 构建查询条件:后台接收到参数后,根据这些参数构建查询条件。可以使用SQL语句,例如使用where子句拼接查询条件,或者使用框架如MyBatis提供的动态SQL来实现条件构建。 3. 执行查询操作:使用构建好的查询条件执行查询操作,查询出满足条件的数据。可以通过调用数据库操作API来实现,例如使用JDBC、MyBatis等。 4. 分页查询:对于大数据量的表格,我们一般需要进行分页查询,即每次只查询一页的数据后台需要根据前端传递的分页参数,例如当前页码和每页显示数据量,计算出查询的起始位置和结束位置,并在查询条件中加入这些限制条件。 5. 返回查询结果:将查询出的结果返回给前端,一般使用JSON格式进行返回。可以使用框架提供的工具类将查询结果转换成JSON字符串,然后通过响应对象返回给前端。 综上所述,Layui数据表格的查询后台的实现步骤包括接收参数、构建查询条件、执行查询操作、分页查询和返回查询结果。通过以上步骤,就可以实现Layui数据表格的查询功能。 ### 回答3: Layui是一个基于前端框架的开源库,它提供了丰富的组件和工具,用于简化前端开发。其中的数据表格组件可以进行数据的展示、编辑、删除等操作。要实现Layui数据表格的查询功能,需要在后台进行相应的编写。 首先,需要定义一个后台接口用于接收前端传递过来的查询条件。可以使用常见的后台开发框架,如Spring MVC或Express.js。在该接口中,需要解析前端传递的查询条件,并根据条件在数据库中进行相应的查询操作。 接着,根据接口中接收到的查询条件进行数据库查询。可以使用SQL语句进行查询,也可以使用ORM框架进行对象关系映射。根据具体的业务需求,编写相应的查询语句或者利用ORM框架提供的API进行查询操作。 查询到数据后,需要将查询结果封装成JSON格式返回给前端。可以使用后台框架提供的JSON转换工具,将查询结果转换为JSON字符串。将查询结果返回给前端之后,前端可以根据返回的数据进行展示或者其他的操作。 在前端的页面中使用Layui数据表格组件进行展示,需要设置数据源为后台接口的URL,并指定查询条件。可以使用Layui数据表格配置项进行相应的设置,如设置列属性、分页等。通过发送Ajax请求,请求后台的接口,并将查询条件作为参数传递。接收到后台返回的数据后,根据数据进行表格的渲染和展示。 总之,实现Layui数据表格的查询功能,需要在后台编写相应的接口、数据库查询和返回数据的方法。前端需要配置页面和发送请求,接收并处理后台返回的查询结果。这样就可以实现Layui数据表格的查询功能了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值