href=“${pageContext.request.contextPath }/static/js/jquery-easyui-1.5.1/themes/default/easyui.css”>
href=“${pageContext.request.contextPath }/static/js/jquery-easyui-1.5.1/themes/icon.css”>
src=“${pageContext.request.contextPath }/static/js/jquery-easyui-1.5.1/jquery.min.js”>
src=“${pageContext.request.contextPath }/static/js/jquery-easyui-1.5.1/jquery.easyui.min.js”>
src=“${pageContext.request.contextPath }/static/js/book.js”>
每个表都需要建立相应的js
建立book.js
将demo文件中的datagrid.data1.json复制到WebContent目录下
book.js代码如下:
$(function() {
/**
* 注意:js文件中不支持el表达式
*/
$(‘#dg’).datagrid({
url:‘datagrid_data1.json’,
columns:[[
{field:‘productid’,title:‘id’,width:100},
{field:‘productname’,title:‘名称’,width:100},
{field:‘unitcost’,title:‘价格’,width:100,align:‘right’}
]]
});
})
4.造数据
建立实体类Book
package com.zking.entity;
public class Book {
private int bid;
private String bname;
private float price;
public int getBid() {
return bid;
}
public void setBid(int bid) {
this.bid = bid;
}
public String getBname() {
return bname;
}
public void setBname(String bname) {
this.bname = bname;
}
public float getPrice() {
return price;
}
public void setPrice(float price) {
this.price = price;
}
@Override
public String toString() {
return “Book [bid=” + bid + “, bname=” + bname + “, price=” + price + “]”;
}
}
建立BookDao
package com.zking.dao;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.zking.entity.Book;
import com.zking.util.BaseDao;
import com.zking.util.PageBean;
import com.zking.util.StringUtils;
public class BookDao extends BaseDao {
public List list(Book book, PageBean pageBean) throws Exception {
String bname = book.getBname();
String sql = “select * from t_mvc_book where 1=1”;
if (StringUtils.isNotBlank(bname)) {
sql += “and bname like '%” + bname + “%'”;
}
return super.executeQuery(sql, Book.class, pageBean);
}
public static void main(String[] args) throws Exception {
BookDao bookDao = new BookDao();
PageBean pageBean = new PageBean();
List list = bookDao.list(new Book(), pageBean);
ObjectMapper om = new ObjectMapper();
// json数组
Map<String, Object> map = new HashMap<String, Object>();
map.put(“total”, pageBean.getTotal());
map.put(“rows”, list);
System.out.println(om.writeValueAsString(list));
}
}
BookAction子控制器
package com.zking.web;
import java.util.List;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.zking.dao.BookDao;
import com.zking.entity.Book;
import com.zking.framework.ActionSupport;
import com.zking.framework.ModelDriver;
import com.zking.util.PageBean;
import com.zking.util.R;
import com.zking.util.ResponseUtil;
//ctrl+shif+z trycatch包裹
public class BookAction extends ActionSupport implements ModelDriver {
private Book book = new Book();
public BookDao bookDao = new BookDao();
public String datagrid(HttpServletRequest req, HttpServletResponse resp) throws Exception {
BookDao bookDao = new BookDao();
PageBean pageBean = new PageBean();
pageBean.setRequest(req);
List list = bookDao.list(book, pageBean);
ObjectMapper om = new ObjectMapper();
// json数组
// Map<String, Object> map = new HashMap<String, Object>();
// map.put(“total”, pageBean.getTotal());
// map.put(“rows”, list);
// 链式编程
ResponseUtil.writeJson(resp, new R().data(“total”, pageBean.getTotal()).data(“rows”, list));
return null;
}
@Override
public Book getModel() {
// TODO Auto-generated method stub
return book;
}
}
book.js代码如下:
$(function() {
紧跟潮流
大前端和全栈是以后前端的一个趋势,懂后端的前端,懂各端的前端更加具有竞争力,以后可以往这个方向靠拢。
这边整理了一个对标“阿里 50W”年薪企业高级前端工程师成长路线,由于图片太大仅展示一小部分