关注分享主机优惠活动
国内外VPS云服务器

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>

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

未经允许不得转载:主机频道 » EasyUI项目门户书籍、分类查询、图片上传(easyui官方文档)

评论 抢沙发

评论前必须登录!