视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
jquery实现显示已选用户_jquery
2020-11-27 21:25:28 责编:小采
文档


选择用户是一个比较常用的功能,主要包含2个功能点(保存已选选项、显示已选用户)

功能要求:

1 选择用户界面以弹出框方式显示

2 页面选项动态加载(部门及用户)

3 已选用户以勾选方式显示

实现分析:

首先因为窗口是个弹出框,所以页面的内容主要是以异步方式获取。因为内容分为两个部分(1待选项、2选中项)所以就有两种处理方法.

方法1:后台根据数据(1待选项、2选中项)生成完整的html代码,通过一次异步操作返回

方法2:待选项、和选中项通过2次异步方法获取,然后在页面js事项选中效果。

因为不喜欢把很多逻辑写在页面上,所以比较喜欢第一种方案,也比较推荐。

页面

1 弹出选择共享文件的对话框
逻辑:1 异步调用 showShareRange 方法,获得完整的html代码。



2 弹出框界面代码

 
 
 分享文件 
 
 
 
  
 
 
 
 

后台代码
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 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 userIdList) throws Exception{ 
 IOrgServiceClient client = new IOrgServiceClient(); 
 IOrgServicePortType service = client.getIOrgServiceHttpPort(); 
 List deptlist = Ws_DeptCenter.getAllDepts(); 
 Map map = new HashMap(); 
 StringBuffer sb = new StringBuffer(); 
 //循环每个的部门 
 for(WebDeptment dept:deptlist){ 
 log.info(dept.getDepId()); 
 List userList = userManager.getUserListByDeptid(dept.getDepId(),dept.getActdepId(), service); 
 sb.append(""+dept.getDepMiniName()+""); 
 sb.append(""); 
 //循环每个的部门用户 
 for(DmUser user:userList){ 
 String userid = user.getUserId(); 
 String username = user.getUserName(); 
 sb.append("
  • "); // 用户是否属是共享用户 if(userIdList.contains(userid)){ log.info(userid); sb.append("").append(username).append(" "); }else{ sb.append("").append(username).append(" "); } sb.append("
  • "); } sb.append(""); } return sb.toString(); }

    service 生成的html参考(仅供参考,无需实现)

    院领导 
     
     
  • 肖林
  • 王硕佟
  • 汪胜洋
  • 齐峰
  • 唐忆文
  • 张利生
  • 郑韶
  • 办公室
  • 陆建平
  • 郭顺兰
  • 方颖
  • 焦晓君
  • 宋维蕾
  • 张新民
  • 李靖
  • 王开宇
  • 下载本文
    显示全文
    专题