選擇用戶是一個比較常用的功能，主要包含2個功能點（保存已選選項、顯示已選用戶）
功能要求：
1 選擇用戶界面以彈出框方式顯示
2 頁面選項動態加載（部門及用戶）
3 已選用戶以勾選方式顯示
實現分析：
首先因為窗口是個彈出框，所以頁面的內容主要是以異步方式獲取。因為內容分為兩個部分（1待選項、2選中項）所以就有兩種處理方法.
方法1：后臺根據數據（1待選項、2選中項）生成完整的html代碼，通過一次異步操作返回
方法2：待選項、和選中項通過2次異步方法獲取，然后在頁面js事項選中效果。
因為不喜歡把很多邏輯寫在頁面上，所以比較喜歡第一種方案，也比較推薦。
頁面
1 彈出選擇共享文件的對話框
邏輯：1 異步調用 showShareRange 方法，獲得完整的html代碼。
//彈出選擇共享文件的對話框 function showShareFile(){ disableFileArea(); if(!chooseObj.isChoosed()){ handleWarm("請先選擇文件或者目錄"); enableFileArea(); return; } $('#shareRange').html(''); showflowcontent('fxcontentflow'); $.ajax({ url : '../share/showShareRange.do', //url:'${ctx}/index.jsp', cache : false, type : 'post', dataType : 'html', async : true, contentType : "application/x-www-form-urlencoded;charset=utf-8", data : { 'signid' :chooseObj.id, 'objtype' :chooseObj.type }, success : function(html) { $('#shareRange').html(html); } }) }2 彈出框界面代碼
<div class="flowcontent" id="fxcontentflow"> <div id="fxloadfile" class="content"> <div class="title"><strong>分享文件</strong><input type="button" class="closebtn gb" onClick="hideflowcontent(this)" title="關閉" /><input type="button" class="hidebtn" /></div> <div class="body"> <div class="file" id='shareRange'><!-- 共享范圍 --> </div><!-- file --> <div class="btns"><input type="button" class="submitbtn" value="" onClick="shareFile()" /><input type="button" class="cancelbtn gb" onClick="closeflowcontent('fxcontentflow')" /></div> <div class="h30"></div> </div> </div> </div> 后臺代碼
controller
/** * 顯示指定文件、文件夾的共享范圍（共享用戶） * @param request fileid 選中的文件id folderid 選中的文件夾id objtype 操作對象類型（file、folder） * @param response * @throws Exception * @ * return 0表示無權限操作/1表示有權限操作 * */ public void showShareRange(HttpServletRequest request,HttpServletResponse response) { String signid = request.getParameter("signid") == null ? "" : request.getParameter("signid"); String objtype = request.getParameter("objtype") == null ? "" : request.getParameter("objtype"); // 獲得當前共享用戶 List<String> userIdList= fileShareManager.showShareRange(signid, objtype); try { // 把共享范圍轉換成html格式 String str = fileShareManager.trunToShareRangeHtml(userIdList); response.setCharacterEncoding("UTF-8"); PrintWriter pw = response.getWriter(); pw.write(str); pw.flush(); pw.close(); } catch (Exception e) { // TODO Auto-generated catch block logger.info(e); e.printStackTrace(); } } service
/** * 把共享范圍轉換成html格式 * @param userIdList 已經共享的人員列表 * @return * @throws Exception */ public String trunToShareRangeHtml(List<String> userIdList) throws Exception{ IOrgServiceClient client = new IOrgServiceClient(); IOrgServicePortType service = client.getIOrgServiceHttpPort(); List<WebDeptment> deptlist = Ws_DeptCenter.getAllDepts(); Map map = new HashMap(); StringBuffer sb = new StringBuffer(); //循環每個的部門 for(WebDeptment dept:deptlist){ log.info(dept.getDepId()); List<DmUser> userList = userManager.getUserListByDeptid(dept.getDepId(),dept.getActdepId(), service); sb.append("<div class=/"fxtitle/">"+dept.getDepMiniName()+"</div>"); sb.append("<ul class=/"fxxz/">"); //循環每個的部門用戶 for(DmUser user:userList){ String userid = user.getUserId(); String username = user.getUserName(); sb.append("<li>"); // 用戶是否屬是共享用戶 if(userIdList.contains(userid)){ log.info(userid); sb.append("<input type='checkbox' checked=true name='shareUserId' value ='").append(userid).append("'/>").append(username).append(" "); }else{ sb.append("<input type='checkbox' name='shareUserId' value ='").append(userid).append("'/>").append(username).append(" "); } sb.append("</li>"); } sb.append("</ul>"); } return sb.toString(); } service 生成的html參考（僅供參考，無需實現）
<div class="fxtitle">院領導</div> <ul class="fxxz"> <li><input type="checkbox" name="shareUserId" value="xiaolin">肖林 </li> <li><input type="checkbox" name="shareUserId" value="wangshuotong">王碩佟 </li> <li><input type="checkbox" name="shareUserId" value="wangshengyang">汪勝洋 </li> <li><input type="checkbox" name="shareUserId" value="qifeng">齊峰 </li> <li><input type="checkbox" name="shareUserId" value="tangyiwen">唐憶文 </li> <li><input type="checkbox" name="shareUserId" value="zhanglisheng">張利生 </li> <li><input type="checkbox" name="shareUserId" value="zhengshao">鄭韶 </li> </ul> <div class="fxtitle">辦公室</div> <ul class="fxxz"> <li><input type="checkbox" name="shareUserId" value="lujianping">陸建平 </li> <li><input type="checkbox" checked="true" name="shareUserId" value="guoshunlan">郭順蘭 </li> <li><input type="checkbox" name="shareUserId" value="fangying">方穎 </li> <li><input type="checkbox" name="shareUserId" value="jiaoxiaojun">焦曉君 </li> <li><input type="checkbox" checked="true" name="shareUserId" value="songweilei">宋維蕾 </li> <li><input type="checkbox" name="shareUserId" value="zhangxinmin">張新民 </li> <li><input type="checkbox" checked="true" name="shareUserId" value="lijing">李靖 </li> <li><input type="checkbox" name="shareUserId" value="wangkaiyu">王開宇 </li> </ul>
新聞熱點
疑難解答
