EasyUI项目门户书籍、分类查询、图片上传（easyui官方文档）

摘要：序言延续上一篇文章，描述了该项目的在线书店门户图书类别。 搜索照片或上传码字并不容易。 点击下面转载，会看到开发工具的说明，目录1目标1目标2具体思路和代码、效果查看2具体思路和代码、效果。 1. 显示菜单栏。 1. 显示菜单栏。 2. 点击左侧菜单栏，显示对应的书籍。

前言：接上篇文章，讲解EasyUi项目“网上书店”的门户图书、分类查询、图片上传。

写代码不容易，请关注我们

如果转载，请提供说明。

开发工具：Eclipse、MySQL

目录

1.目标

2.展示具体的想法、代码和效果

1.显示菜单栏

2.点击左侧菜单栏，显示对应的书籍。

三.图片上传

1.目的

1.左侧没有菜单栏，所以需要显示菜单栏

2.左侧菜单栏点击

3.上传图片

2.展示具体思路、代码、效果 1.显示菜单栏

①思路

1.学习如何查询图书

2.在Index.js中定义一个jsonarr，使用ajax技术接收数据

3.定义HTML来组合数据

4.显示

②代码

index.js

$(function(){$.ajax({url: $("#ctx").val()+ "/category.操作？methodName=组合框”，成功：函数（数据）{ var jsonArr = eval（“（”+数据+“）”）; var html =“” for（var i in jsonArr）; “”+ jsonArr [i]。名称+""; $(".list-group").append(html);})

③效果展示

2.点击左侧菜单栏，显示对应的书籍。

①思路

1.对于Index.js，需要在相应的方法中添加点击事件，并将其ID传递给Index.jsp接口。

2.当点击左侧菜单栏时，必须将改变的类别的ID传递给图书搜索方法。

3.最后查询修改后的类别中的所有图书。 首先在bookdao中添加cid条件，最后用bookAction调用

②代码

index.js

for ( var i in jsonArr) { html += " " + jsonArr[i].name + ""; }

index.jsp

函数 searchByType(cid){ location.href="${pageContext .request.contextPath}/book.action?methodName=findByType&cid =" rel="external nofollow" +cid; };

BookDao

public List list(Book book, PageBean pageBean) 抛出异常 {String sql = "select * from t_easyui_book where 1=1";String name = book .getName( );int state = book.getState ();long cid = book.getCid();if(StringUtils.isNotBlank(name)) {如 sql += " 和 " %"+name+"%"" name;}if(状态！=0) {sql += " and state = "+state;}if(cid !=0) {sql += " and cid = "+cid;}return super.executeQuery(sql, Book.class, pageBean);}

BookAction

public String findByType(HttpServletRequest req, HttpServletResponse resp) {try {PageBean pageBean = new PageBean();pageBean.setRequest(req);List list = bookDao.list(book, pageBean); Book", list); req.setAttribute("pagebean", pageBean);} catch (Exception e) {e.printStackTrace();}return "findBook";}

③效果展示

3、图片上传

①思路

1.导入图片上传所需的jar包

2.更改BookDao的图片路径。

3.编写将图像上传到BookAction的方法

4.在Eclipse内部服务器上设置图像映射。

②代码

先导入。 对应jar包：

Dao

public void editImgUrl(Book t) throws Exception{super.executeUpdate("update t_easyui_book set image=? where id=?",t, new String[] {"image","id"});}

Action

public String Upload(HttpServletRequest request, HttpServletResponse resp) {try {DiskFileItemFactory Factory = new DiskFileItemFactory(); = new ServletFileUpload(factory); 列表项 = Upload.parseRequest(request); HttpSession session = request.getSession(); itr.next(); if (item.isFormField()) { System.out.println("常用字段处理"); book.setId(Long.valueOf(request.getParameter("id"))); (!"".equals(item.getName())) { //年/月/日 String imageName = DateUtil.getCurrentDateStr(); // data中存储的数据以及浏览器访问图片的映射地址 String serverDir = PropertiesUtil.getValue("serverDir"); // 图片的实际位置 String diskDir = PropertiesUtil. diskDir" ); // 图片后缀 String subfix = item.getName().split("//.")[1]; book.setImage(serverDir + imageName + "." + subfix); item.write (新文件(磁盘目录 + 图像名称 + "." + 子前缀)); this.bookDao.editImgUrl(book); ResponseUtil.writeJson(resp, 1); catch (例外 e) { e.printStackTrace(); }

图像映射代码

TomCat内部设置

③效果显示

p>

移至此处现在就这些了。 欢迎任何建议。