亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

jquery實現(xiàn)顯示已選用戶

 更新時間:2014年07月21日 10:31:56   投稿:hebedich  
選擇用戶是一個比較常用的功能,主要包含2個功能點(保存已選選項、顯示已選用戶)

選擇用戶是一個比較常用的功能,主要包含2個功能點(保存已選選項、顯示已選用戶)

功能要求:

1 選擇用戶界面以彈出框方式顯示

2 頁面選項動態(tài)加載(部門及用戶)

3 已選用戶以勾選方式顯示

實現(xiàn)分析:

首先因為窗口是個彈出框,所以頁面的內(nèi)容主要是以異步方式獲取。因為內(nèi)容分為兩個部分(1待選項、2選中項)所以就有兩種處理方法.

方法1:后臺根據(jù)數(shù)據(jù)(1待選項、2選中項)生成完整的html代碼,通過一次異步操作返回

方法2:待選項、和選中項通過2次異步方法獲取,然后在頁面js事項選中效果。

因為不喜歡把很多邏輯寫在頁面上,所以比較喜歡第一種方案,也比較推薦。

頁面

1 彈出選擇共享文件的對話框
邏輯:1 異步調(diào)用 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="關(guān)閉" /><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表示無權(quán)限操作/1表示有權(quán)限操作 
   * 
   */ 
  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 { 
      // 把共享范圍轉(zhuǎn)換成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

/** 
   * 把共享范圍轉(zhuǎn)換成html格式 
   * @param userIdList 已經(jīng)共享的人員列表 
   * @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(); 
    //循環(huán)每個的部門 
    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\">"); 
          //循環(huán)每個的部門用戶 
          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參考(僅供參考,無需實現(xiàn))

<div class="fxtitle">院領(lǐng)導(dǎo)</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> 

相關(guān)文章

  • jquery加載單文件vue組件的方法

    jquery加載單文件vue組件的方法

    這篇文章主要介紹了jquery加載單文件vue組件的方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2017-06-06
  • jquery操作select大全

    jquery操作select大全

    這篇文章主要介紹了jquery操作select中使用到的方法和示例,需要的朋友可以參考下
    2014-04-04
  • jquery ajax同步異步的執(zhí)行最終解決方案

    jquery ajax同步異步的執(zhí)行最終解決方案

    添加async:false.即修改為同步了,什么意思?按同事解釋就是,這是等這個ajax有了返回值后才會執(zhí)行下面的js一語道破天機,怪不得以前很多ajax調(diào)用里面的賦值都不起作用
    2013-04-04
  • 精心收集的jQuery常用的插件1000

    精心收集的jQuery常用的插件1000

    花N長時間積累的Jquery插件,希望大家喜歡。大家還有什么新的插件,請留言,我們一并收錄。感謝大家的支持。
    2011-05-05
  • jQuery返回定位插件詳解

    jQuery返回定位插件詳解

    本篇文章主要介紹了jQuery返回定位插件的相關(guān)知識,具有很好的參考價值。下面跟著小編一起來看下吧
    2017-05-05
  • JQuery.closest(),parent(),parents()尋找父結(jié)點

    JQuery.closest(),parent(),parents()尋找父結(jié)點

    在50個必備的實用jQuery代碼段看到關(guān)于closest()方法的介紹,考慮到開發(fā)過程中經(jīng)常有找爹的需求,以前用的都是parent()/parents()方法(還經(jīng)常找不到?。?,所以就此研究對比一下!
    2012-02-02
  • Jquery ui css framework

    Jquery ui css framework

    Jquery ui css framework是jquery ui中的一個樣式框架,可以利用jquery Theme roller 來生成自己想要的css樣式效果。我們可以利用jquery ui的一些框架來開發(fā)出基于jquery ui css framework效果的插件來。
    2010-06-06
  • jQuery實現(xiàn)的選擇商品飛入文本框動畫效果完整實例

    jQuery實現(xiàn)的選擇商品飛入文本框動畫效果完整實例

    這篇文章主要介紹了jQuery實現(xiàn)的選擇商品飛入文本框動畫效果,結(jié)合完整實例形式分析了jQuery動態(tài)操作頁面元素屬性實現(xiàn)動畫效果的方法,涉及jQuery的事件綁定、元素遍歷及屬性操作等相關(guān)技巧,需要的朋友可以參考下
    2016-08-08
  • jQuery版AJAX簡易封裝代碼

    jQuery版AJAX簡易封裝代碼

    這篇文章主要為大家詳細介紹了jQuery版AJAX簡易封裝代碼,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2016-09-09
  • jQuery新聞滾動插件 jquery.roller.js

    jQuery新聞滾動插件 jquery.roller.js

    任務(wù)需要,就寫了一個jQuery新聞滾動插件jquery.roller.js,功能相對比較簡單,可能往后會加入ajax一段時間輪詢 動態(tài)加載的功能.下面直接給出源代碼,如果需要可以直接下載
    2011-06-06

最新評論