1、displaytag如何实现获取到每行的id字段的值。

  使用封装好的框架,有时候,对于一个知识点不熟悉,可能会浪费你大把的时间,我使用displaytag主要是使用它的分页技术,但是客户提出的需求,是获取到每行的id,然后选择一个用户名称(用户id),将他们关联操作,其实业务很简单,但是获取到你想要的这一行,一开始确实难为着我了,后来才发现,很简单。

代码如下所示:

  1 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> 
  2 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> 
  3 <%@ taglib prefix="display" uri="http://displaytag.sf.net"%> 
  4 <% 
  5     //获取绝对路径路径  
  6     String path = request.getContextPath(); 
  7     String basePath = request.getScheme() + "://" 
  8                 + request.getServerName() + ":" + request.getServerPort() 
  9                 + path + "/"; 
 10 %>  
 11 <!DOCTYPE html> 
 12 <html> 
 13 <head> 
 14 <base href="<%=basePath %>" /> 
 15 <meta charset="UTF-8"> 
 16 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
 17 <title>图书管理-图书查询</title> 
 18 <link href="resource/css/bootstrap.min.css" rel="stylesheet" /> 
 19 <link rel="stylesheet" href="resource/table/bootstrap-table.min.css"> 
 20 <link type="text/css" rel="stylesheet" href="resource/select2/css/select2.min.css"> 
 21 <script type="text/javascript" src="resource/js/jquery.min.js"></script> 
 22 <script type="text/javascript" src="resource/js/bootstrap.min.js"></script> 
 23 <script src="resource/table/bootstrap-table.min.js"></script> 
 24 <script type="text/javascript" src="resource/select2/js/select2.js"></script> 
 25  
 26 <style type="text/css"> 
 27  
 28 tr th{text-align:center;} 
 29 tr td{text-align:center;} 
 30 </style> 
 31 <script type="text/javascript"> 
 32     $(document).ready(function(){ 
 33         $("#clickIt").click(function(){ 
 34             alert("sorry,此类图书数量为0,不可借阅......"); 
 35         }); 
 36     }); 
 37      
 38     //启动之前,先查询出地方前置库信息,然后将地方前置库的信息传递到实例数据表中 
 39     $(function(){ 
 40         var url = "system/book/userAjax"; 
 41         $.ajax({ 
 42             type : 'POST', 
 43             url : url, 
 44             dataType : 'json', 
 45             //traditional : true, 
 46             //async : false, 
 47             success : function(data) { 
 48                 //console.log(data.list); 
 49                 var result = data.list; 
 50                 for(var i=0;i<result.length;i++){ 
 51                     //console.log(result[i].userAccount); 
 52                     $("#userNameCategory").append("<option value='"+ result[i].userId +"'>" + result[i].userAccount + "</option>"); 
 53                 } 
 54             } 
 55         }) 
 56     }); 
 57      
 58     function borrowBooksFunction(bookIds){ 
 59         //关键点在于获取到图书的编号 
 60         console.log(bookIds); 
 61         //关键点,管理员通过借阅这本书给学生,将这本书的bookId给某个学生 
 62         $("#setBookId").val(bookIds); 
 63     } 
 64      
 65 </script> 
 66 </head> 
 67 <body> 
 68     <div> 
 69         <ul class="breadcrumb" style="margin: 0px;"> 
 70             <li>系统管理</li> 
 71             <li>图书管理</li> 
 72             <li>图书查询</li> 
 73         </ul> 
 74     </div> 
 75     <form action="${basePath }system/book/select" method="post" class="form-inline"> 
 76         <div class="row alert alert-info" style="margin: 0px; padding: 5px;"> 
 77             <div class="form-group"> 
 78                 <label>条件:</label>  
 79                 <select name="condition" class="form-control"> 
 80                     <option value="bookName" ${condition == 'bookName'?'selected':'' }>图书名称</option> 
 81                     <option value="bookAuthor" ${condition == 'bookAuthor'?'selected':'' }>图书作者</option> 
 82                     <option value="bookType" ${condition == 'bookType'?'selected':'' }>图书类别</option> 
 83                 </select> 
 84                 <input type="text" name="content" value="${result }" class="form-control" placeholder="请输入查询条件" /> 
 85             </div> 
 86             <input type="submit" class="btn btn-danger" value="查询">  
 87             <a href="system/book/insert" class="btn btn-success"> 
 88                 添加图书 
 89             </a> 
 90         </div> 
 91         <div class="row" style="padding: 15px;">     
 92             <display:table name="${list }" id="bookIds" pagesize="10" requestURI="system/book/select" class="table table-hover table-striped table-bordered"> 
 93                 <display:column property="bookId" title="图书编号"></display:column> 
 94                 <display:column property="bookName" title="图书名称"></display:column> 
 95                 <display:column property="bookAuthor" title="图书作者"></display:column> 
 96                 <display:column property="bookPrice" title="图书价格"></display:column> 
 97                 <display:column property="bookType" title="图书类型"></display:column> 
 98                 <display:column property="bookPublish" title="图书出版社"></display:column> 
 99                 <display:column property="bookSum" title="图书总数"></display:column> 
100                 <!-- 如果是管理员,具有借书,还书,修改,删除功能的权限 --> 
101                 <c:if test="${userMark == '管理员' }"> 
102                     <display:column paramId="bookId" paramProperty="bookId" title="借书"> 
103                         <!-- 按钮触发模态框 --> 
104                         <a href="" id="borrowBooks" οnclick="borrowBooksFunction(<c:out value='${bookIds.bookId}'></c:out>)" data-toggle="modal" data-target="#myModal"> 借书  
105                         </a> 
106                     </display:column> 
107                     <display:column href="system/book/update" paramId="bookId" paramProperty="bookId" title="修改" value="修改"></display:column> 
108                     <display:column href="system/book/delete" paramId="bookId" paramProperty="bookId" title="删除" value="删除"></display:column> 
109                 </c:if> 
110                  
111             </display:table> 
112         </div> 
113     </form> 
114      
115     <form action="${basePath }system/book/adminBorrow" method="post" class="form-horizontal setWidth"> 
116         <!-- 模态框(Modal) --> 
117         <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
118             <div class="modal-dialog"> 
119                 <div class="modal-content"> 
120                     <div class="modal-header"> 
121                         <button type="button" class="close" data-dismiss="modal" aria-hidden="true"> 
122                             &times; 
123                         </button> 
124                         <h4 class="modal-title" id="myModalLabel"> 
125                             用户信息 
126                         </h4> 
127                     </div> 
128                     <div class="modal-body"> 
129                         <input type="hidden" name="bookId" id="setBookId" value=""/> 
130                         <select class="form-control width175" id="userNameCategory" name="userId"> 
131                             <option value='0'>-- 请选择 --</option> 
132                         </select> 
133                     </div> 
134                     <div class="modal-footer"> 
135                         <button type="button" class="btn btn-default" data-dismiss="modal">关闭 
136                         </button> 
137                         <!-- <button type="button" class="btn btn-primary"> 
138                             提交 
139                         </button> --> 
140                         <input type="submit" class="btn btn-success" value="提交" />  
141                     </div> 
142                 </div><!-- /.modal-content --> 
143             </div><!-- /.modal --> 
144         </div> 
145     </form> 
146      
147 </body> 
148 </html>

效果如下所示:

2、关键点操作如下所示:

然后如下所示:

然后完成你想要实现的效果:

打完收工

待续......


发布评论
IT序号网

微信公众号号:IT虾米 (左侧二维码扫一扫)欢迎添加!

基于kafka_2.11-2.1.0实现的生产者和消费者代码样例知识解答
你是第一个吃螃蟹的人
发表评论

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。