使用dtree展示所有分类

步骤分析
代码实现

1）步骤分析

左边的dtree:

导入dtree.js
导入dtree.css
创建一个div,添加样式：class=“dtree”
在div中编写js
- 创建一个树：d=new dTree(‘d’);
- 添加根节点：d.add(当前节点id，父节点，显示名称，点击时要打开的连接，放上去显示的名称title，在哪个地方打开这个连接target)；
  注意：根节点的父节点id写-1
- 添加其他节点
最后通过document.write(d)写到页面即可

分类信息添加

应在左边的dtree上添加链接(展示所有的分类信息:
d.add(…，“store/adminCategory/findAll”,“mainFrame”)
创建adminCategoryservlet,编写findAll()
将查询的结果list放入request中转发到/admin/category/list.jsp

2）代码实现

①在left.jsp中添加js

<script type="text/javascript">d = new dTree('d');d.add('01',-1,'系统菜单树');d.add('0102','01','分类管理','','','mainFrame');d.add('010201','0102','分类管理','${pageContext.request.contextPath}/adminCategory/findAll','','mainFrame');document.write(d);</script>

②完成AdminCategoryServlet

@WebServlet("/adminCategory/*")
public class AdminCategoryServlet extends HttpServlet{private static final long serialVersionUID = 788171461042516619L;private CategoryService categoryService=new CategoryServiceImpl();@Overrideprotected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {//得到URIString uri=request.getRequestURI();//处理各个方法抛出的异常try {if(uri.endsWith("/findAll")) {findAll(request,response);}} catch (Exception e) {// TODO Auto-generated catch blocke.printStackTrace();//抛出自定义异常throw new MyException();} }private void findAll(HttpServletRequest request, HttpServletResponse response) throws Exception {//1、调用categoryService查询所有分类信息返回值listList<Category> list=categoryService.findAll();//2、绑定转发request.setAttribute("list", list);request.getRequestDispatcher("/admin/category/list.jsp").forward(request, response);}
}

③在jsp页面展示数据

 <c:forEach var="c" items="${ list }" varStatus="vs"><tr onmouseover="this.style.backgroundColor = 'white'"onmouseout="this.style.backgroundColor = '#F5FAFE';"><td style="CURSOR: hand; HEIGHT: 22px" align="center"width="18%">${vs.count }</td><td style="CURSOR: hand; HEIGHT: 22px" align="center"width="17%">${c.cname }</td><td align="center" style="HEIGHT: 22px"><a href="${ pageContext.request.contextPath }/adminCategory"><img src="${pageContext.request.contextPath}/images/i_edit.gif" border="0" style="CURSOR: hand"></a></td><td align="center" style="HEIGHT: 22px"><a href="${ pageContext.request.contextPath }/adminCategory"><img src="${pageContext.request.contextPath}/images/i_del.gif" width="16" height="16" border="0" style="CURSOR: hand"></a></td></tr></c:forEach>

④测试即可

23_使用dtree展示所有分类相关推荐

layui获得列表json数据_golang实战开发之博客功能篇：文章列表的读取与展示和分类筛选展示处理...
前面我们介绍了文章详情页面的展示的逻辑代码实现,这一节,我们将继续讲解文章列表的读取和展示.文章根据分类进行筛选.最新文章.热门文章等的调用处理逻辑. 首先,我们先编写文章列表页的前端代码.这里,我们 ...
商品服务3-三级分类-查询展示三级分类数据
一.配置如何发送请求访问到真正的三级分类数据在解决跨域问题之后可以登录人人快速开发平台,但是点进去分类维护列表时,会发现在访问product/category/list/tree时报错,因为请求是去 ...
数据可视化实战——1.展示多级分类数据
文章目录前言一.数据筛选二.数据处理 2.1 数据来源统计 2.2 分级数据可视化前言大家好✨,这里是bio
BBS（仿博客园系统）项目03（主页搭建、个人站点搭建（侧边栏分类展示、标签展示、日期归档）、文章详情页相关功能实现）...
摘要: 主页面的搭建(导航条下面的区域) 个人站点侧边栏分类展示侧边栏标签展示侧边栏日期归档文章详情页文章内容文章点赞点踩文章评论一.主页面home.html的搭建(进一步完善) ho ...
CVM2021| PCT: Point cloud transformer（分类+分割任务SOTA）
点击上方"3D视觉工坊",选择"星标" 干货第一时间送达作者丨paopaoslam 来源丨泡泡机器人SLAM 标题:PCT: Point cloud tra ...
dtree的使用和扩展
相信用过dtree的童靴的不在少数,网络上流传的JS树有很多,例如雪花树MzTreeView,EXT.Struts2出来之后,也有自己的树控件,但是这么多风姿卓约的倩影中,我独爱,独爱dtree那一棵 ...
复盘-电商产品「分类」功能迭代
"分类"功能基本是电商产品的标配.如果你说记不清了,可以看看下面京东.淘宝的分类,是不是瞬间唤起了你的记忆,很熟悉对吧? 我在做电商方向的产品后,接手的第一个功能就是优化" ...
Elasticsearch检索分类详解
Elasticsearch中当我们设置Mapping(分词器.字段类型)完毕后,就可以按照设定的方式导入数据. 有了数据后,我们就需要对数据进行检索操作.根据实际开发需要,往往我们需要支持包含但不限于 ...
学成在线--18.新增课程（课程分类查询）
文章目录一.需求分析二.课程分类查询介绍三.数据结构四.数据格式五.数据模型六.Api接口七.服务器端 1.Dao 1)定义mapper 2)定义mapper映射文件 2.Service ...
深度学习分类任务常用评估指标
摘要:这篇文章主要向大家介绍深度学习分类任务评价指标,主要内容包括基础应用.实用技巧.原理机制等方面,希望对大家有所帮助. 本文分享自华为云社区<深度学习分类任务常用评估指标>,原文作者: ...

23_使用dtree展示所有分类

使用dtree展示所有分类

1）步骤分析

2）代码实现

①在left.jsp中添加js

②完成AdminCategoryServlet

③在jsp页面展示数据

④测试即可

23_使用dtree展示所有分类相关推荐

最新文章

热门文章