当前位置:  编程技术>WEB前端

jquery实现显示已选用户

    来源: 互联网  发布时间:2014-08-25

    本文导语:  选择用户是一个比较常用的功能,主要包含2个功能点(保存已选选项、显示已选用户) 功能要求: 1 选择用户界面以弹出框方式显示 2 页面选项动态加载(部门及用户) 3 已选用户以勾选方式显示 实现分析: 首先因为窗口是...

选择用户是一个比较常用的功能,主要包含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 弹出框界面代码

分享文件

后台代码
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参考(仅供参考,无需实现)

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


    
 
 

您可能感兴趣的文章:

  • 通过javascript库JQuery实现页面跳转功能代码
  • jQuery实现CSS3动画效果的插件 jQuery Transit
  • struts+spring+hibernate+jquery实现分页功能的几个基本类介绍(异步加载)
  • JQuery实现元素屏幕居中显示的代码
  • jquery 回车登录的实现方法
  • 基于jQuery实现的MVC开发框架 CorMVC
  • 简单的代码实现jquery定时器
  • jQuery Trim去除字符串首尾空字符的实现方法说明
  • jquery插件开发之实现jquery手风琴功能分享
  • jQuery实现回车键(Enter)切换文本框焦点的代码实例
  • jquery实现的导航固定效果
  • jquery实现点击消失的代码
  • jquery 实现弹出div位于屏幕正中(图文)
  • jQuery 表格隔行换色 鼠标高亮行变色的实现代码
  • jquery特效 table鼠标滑过变色的实现代码
  • Jquery点击高亮显示的实现代码
  • jquery实现图片路径不存在时进行替换的代码
  • jquery 选择块与改变属性值的实现方法
  • 60秒倒计时的jquery实现代码
  • jquery半透明设置实现代码
  • jquery 实现文本框焦点自动跳转
  • jQuery显示隐藏密码插件 jquery.toggle-password
  • jQuery图片显示插件 PrettyPhoto
  • jquery响应鼠标事件 jquery隐藏与显示input默认值
  • 显示矢量地图的jQuery 插件 jVectorMap
  • jQuery源码结构显示插件 CodeExplorer
  • jQuery判断元素显示与隐藏
  • jquery控制css的display属性(显示与隐藏)
  • textarea显示成label的样式 jquery实例
  • jQuery 解析和显示 RSS 订阅插件 FeedEk
  • jQuery 等高显示插件 matchHeight
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • jquery easyui easyui-datetimebox 取消用户输入
  • sqlserver iis7站长之家
  • Jquery验证用户名与密码的实例代码
  • jquery限制用户只能输入数字
  • jquery检验用户是否已注册的实例代码
  • jQuery异步验证用户名是否存在示例代码
  • Jquery验证用户名和密码的代码举例
  • jquery记住用户名与密码实现方法
  • JQuery记住用户名和密码的具体实现
  • jQuery的cookie插件实现保存用户登陆信息
  • struts2+jquery组合验证注册用户是否存在
  • jquery统计用户选中的复选框的个数
  • 自用的js与Jquery验证代码(日期 EMail邮箱 用户名、密码、手机号码等)
  • Jquery与CSS模拟超链接的用户单击事件的代码学习
  • jquery实现保存已选用户
  • jQuery+Ajax模拟用户登录功能的实现代码
  • jQuery概述,代码举例及最新版下载
  • jQuery鼠标动画插件 jquery-ahover
  • Jquery操作html复选框checkbox:全选,全不选和反选
  • jQuery向导插件 Jquery Wizard Plugin
  • jQuery圆角插件 jQuery Corners
  • jQuery相册插件 jQuery.popeye
  • jQuery UI组件 jQuery UI
  • jQuery右键菜单插件 jQuery ContextMenu
  • jQuery分页插件 Pagination jQuery Plugin
  • jQuery日历插件 jQuery Week Calendar
  • jQuery的中文日历插件 jQuery.datePickerCn
  • jQuery的CSV插件 jQuery CSV
  • jQuery的气泡提示插件 jquery.ns_bub.js
  • jQuery气泡提示插件 jquery-rollover-tooltip
  • jQuery对话框 jQuery Modal Dialog


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3