jquery实现显示已选用户
选择用户是一个比较常用的功能，主要包含2个功能点（保存已选选项、显示已选用户）
功能要求：
1选择用户界面以弹出框方式显示
2页面选项动态加载（部门及用户）
3已选用户以勾选方式显示
实现分析：
首先因为窗口是个弹出框，所以页面的内容主要是以异步方式获取。因为内容分为两个部分（1待选项、2选中项）所以就有两种处理方法.
方法1：后台根据数据（1待选项、2选中项）生成完整的html代码，通过一次异步操作返回
方法2：待选项、和选中项通过2次异步方法获取，然后在页面js事项选中效果。
因为不喜欢把很多逻辑写在页面上，所以比较喜欢第一种方案，也比较推荐。
页面
1弹出选择共享文件的对话框
逻辑：1异步调用showShareRange方法，获得完整的html代码。
//弹出选择共享文件的对话框
functionshowShareFile(){
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弹出框界面代码
<divclass="flowcontent"id="fxcontentflow">
<divid="fxloadfile"class="content">
<divclass="title"><strong>分享文件</strong><inputtype="button"class="closebtngb"onClick="hideflowcontent(this)"title="关闭"/><inputtype="button"class="hidebtn"/></div>
<divclass="body">
<divclass="file"id='shareRange'><!--共享范围-->
</div><!--file-->
<divclass="btns"><inputtype="button"class="submitbtn"value=""onClick="shareFile()"/><inputtype="button"class="cancelbtngb"onClick="closeflowcontent('fxcontentflow')"/></div>
<divclass="h30"></div>
</div>
</div>
</div>
后台代码
controller
/**
*显示指定文件、文件夹的共享范围（共享用户）
*@paramrequest
fileid选中的文件id
folderid选中的文件夹id
objtype操作对象类型（file、folder）
*@paramresponse
*@throwsException
*@
*return0表示无权限操作/1表示有权限操作
*
*/
publicvoidshowShareRange(HttpServletRequestrequest,HttpServletResponseresponse){
Stringsignid=request.getParameter("signid")==null?"":request.getParameter("signid");
Stringobjtype=request.getParameter("objtype")==null?"":request.getParameter("objtype");
//获得当前共享用户
List<String>userIdList=fileShareManager.showShareRange(signid,objtype);
try{
//把共享范围转换成html格式
Stringstr=fileShareManager.trunToShareRangeHtml(userIdList);
response.setCharacterEncoding("UTF-8");
PrintWriterpw=response.getWriter();
pw.write(str);
pw.flush();
pw.close();
}catch(Exceptione){
//TODOAuto-generatedcatchblock
logger.info(e);
e.printStackTrace();
}
}
service
/**
*把共享范围转换成html格式
*@paramuserIdList已经共享的人员列表
*@return
*@throwsException
*/
publicStringtrunToShareRangeHtml(List<String>userIdList)throwsException{
IOrgServiceClientclient=newIOrgServiceClient();
IOrgServicePortTypeservice=client.getIOrgServiceHttpPort();
List<WebDeptment>deptlist=Ws_DeptCenter.getAllDepts();
Mapmap=newHashMap();
StringBuffersb=newStringBuffer();
//循环每个的部门
for(WebDeptmentdept:deptlist){
log.info(dept.getDepId());
List<DmUser>userList=userManager.getUserListByDeptid(dept.getDepId(),dept.getActdepId(),service);
sb.append("<divclass=\"fxtitle\">"+dept.getDepMiniName()+"</div>");
sb.append("<ulclass=\"fxxz\">");
//循环每个的部门用户
for(DmUseruser:userList){
Stringuserid=user.getUserId();
Stringusername=user.getUserName();
sb.append("<li>");
//用户是否属是共享用户
if(userIdList.contains(userid)){
log.info(userid);
sb.append("<inputtype='checkbox'checked=truename='shareUserId'value='").append(userid).append("'/>").append(username).append("");
}else{
sb.append("<inputtype='checkbox'name='shareUserId'value='").append(userid).append("'/>").append(username).append("");
}
sb.append("</li>");
}
sb.append("</ul>");
}
returnsb.toString();
}
service生成的html参考（仅供参考，无需实现）
<divclass="fxtitle">院领导</div> <ulclass="fxxz"> <li><inputtype="checkbox"name="shareUserId"value="xiaolin">肖林</li> <li><inputtype="checkbox"name="shareUserId" value="wangshuotong">王硕佟</li> <li><inputtype="checkbox"name="shareUserId" value="wangshengyang">汪胜洋</li> <li><inputtype="checkbox"name="shareUserId"value="qifeng">齐峰</li> <li><inputtype="checkbox"name="shareUserId"value="tangyiwen">唐忆文</li> <li><inputtype="checkbox"name="shareUserId" value="zhanglisheng">张利生</li> <li><inputtype="checkbox"name="shareUserId"value="zhengshao">郑韶</li> </ul> <divclass="fxtitle">办公室</div> <ulclass="fxxz"> <li><inputtype="checkbox"name="shareUserId"value="lujianping">陆建平</li> <li><inputtype="checkbox"checked="true"name="shareUserId" value="guoshunlan">郭顺兰</li> <li><inputtype="checkbox"name="shareUserId"value="fangying">方颖</li> <li><inputtype="checkbox"name="shareUserId"value="jiaoxiaojun">焦晓君</li> <li><inputtype="checkbox"checked="true"name="shareUserId" value="songweilei">宋维蕾</li> <li><inputtype="checkbox"name="shareUserId"value="zhangxinmin">张新民</li> <li><inputtype="checkbox"checked="true"name="shareUserId" value="lijing">李靖</li> <li><inputtype="checkbox"name="shareUserId"value="wangkaiyu">王开宇</li> </ul>