联科选择器

选择器html代码

<div class="easyui-layout" id="panel" fit="true" style="width:100%;">

<div region="center" border="false" >
<div class="easyui-tabs" id="tabs" data-options="region:'center',fit:true,border:false,plain:true" >
</div>
</div>

<div data-options="region:'east',split:false" title="已选择项" border="false" style="width:200px;overflow:hidden">
<table border=0 width="200px" height="99%" bgcolor=#f4f4f4 cellpadding=0 cellspacing=2 >
<tr><td width=10% >
<a href="#" class="easyui-linkbutton" onclick="dgframe.addsel();" style="width:25px" title="添加选中项" >></a><br><br>
<a href="#" class="easyui-linkbutton" onclick="dgframe.addall();" style="width:25px" title="添加全部" >>></a><br><br>
<a href="#" class="easyui-linkbutton" onclick="removeall();" style="width:25px" title="全部删除" ><<</a><br><br>
<a href="#" class="easyui-linkbutton" onclick="removeuser();"style="width:25px" title="删除选中项" > < </a><br><br>
<br><br><br><br><br><br><br>
<td width=90% height=100% >
<select id="UserList" aname="UserList" style="width:100%;height:100%" multiple size="33"></select>
</td></tr>
</table>
</div>

<div data-options="region:'south',split:false" border="false" style="height:40px;overflow:hidden">
<table border=0 width="100%" height="99%" bgcolor=#f4f4f4 cellpadding=0 cellspacing=2 >
<tr><td align=center >
<a href="#" class="easyui-linkbutton" onclick="selectok();" iconCls="icon-ok" style="width:100px" >确定选择</a>
<a href="#" class="easyui-linkbutton" onclick="parent.$('#win').window('close');" iconCls="icon-remove" style="width:100px" > 取消 </a>
</td></tr></table>
</div>

</div>

 选择器js

$(function(){
//初始化js代码
addDataTab();
$("#tabs").tabs('select',0);
initobjvalue(); //初始化已选择用户
});

//添加线路选择tab
function addDataTab(){
$('#tabs').tabs('add',{
title: "标签选择",
id:'group',
content: '<iframe frameborder="0" src="page?wf_num=P_JYJHGG_VIEW_LABLE" width="100%" height="99%" id="dgframe" name="dgframe" ></iframe>'
});
}


//删除全部用户
function removeall(){
$("#UserList").empty();
}

//检测用户是否已存在
function isexist(userid){
var obj=$("#UserList option[value='"+userid+"']");
if(obj[0]==undefined){
return false;
}else{
return true;
}
}

//添加一个用户
function add(userid,username){
if(!isexist(userid)){
$("#UserList").append("<option value='"+userid+"'>"+username+"</option>");
}
}

//添加一个用户
function adduser(userid,username){
if(!isexist(userid)){
$("#UserList").append("<option value='"+userid+"'>"+username+"</option>");
}
}

//删除选中用户或指定用户
function removeuser(userid){
if(userid){
$("#UserList option[value='"+userid+"']").remove();
}else{
$("#UserList option:selected").remove();
}
}

//获得所有已选择的用户
function getAllDataid(){
var userList="";
$("#UserList option").each(function(){
if(userList==""){
userList=$(this).val();
}else{
userList=userList+","+$(this).val();
}
});
return userList;
}
//获得所有用户中文名
function getAllData(){
var userList="";
$("#UserList option").each(function(){
if(userList==""){
userList=$(this).text();
}else{
userList=userList+","+$(this).text();
}
});
return userList;
}
//初始化读取目标字段已有值
function initobjvalue(){
if(parent.$("#"+GetUrlArg("FdValue")).is('input')){
var userid=parent.$("#"+GetUrlArg("FdValue")).val();
var username=parent.$("#"+GetUrlArg("FdValue")).val();
var idarray=userid.split(",");
var namerray=username.split(",");
for(var i=0;i<idarray.length;i++){
if(idarray[i].trim()!=""){
var userid=idarray[i];
var userName=namerray[i];
if(userName=="" || userName==undefined){
userName=userid;
}
adduser(userid,userName);
}
}
}else if(parent.$("#"+GetUrlArg("FdValue")).is('span')){
var idarray=parent.$("#"+GetUrlArg("FdValue")).text().split(",");
for(var i=0;i<idarray.length;i++){
if(idarray[i].trim()!=""){
var userid=idarray[i];
adduser(userid,userid);
}
}
}else if(parent.$("#"+GetUrlArg("FdValue")).is('select')){
parent.$("#"+GetUrlArg("FdValue")+" option").each(function(){
adduser($(this).val(),$(this).text());
});
}
}

//确定选择
function selectok(){
var fdValueObj = parent.$("#"+GetUrlArg("FdValue"));
var fdTextObj = parent.$("#"+GetUrlArg("FdText"));
if(fdValueObj.is('input')){
var obj=fdTextObj;
var txtobj=fdValueObj;
if(obj.length>0){
obj.val(getAllDataid());
}
if(txtobj.length>0){
txtobj.text(getAllDataid());
txtobj.val(getAllData());
}
}else if(fdValueObj.is('span')){
var obj=fdValueObj;
var txtobj=fdTextObj;
if(obj.length>0){
obj.text(getAllDataid());
}
if(txtobj.length>0){
txtobj.text(getAllData());
}
}else if(fdValueObj.is('select')){
fdValueObj.empty(); //清空
$("#UserList option").each(function(){
fdValueObj.append("<option value='"+$(this).val()+"'>"+$(this).text()+"</option>");
});

//全部选中
var obj=fdValueObj[0];
for(var i=0;i<obj.length;i++){
obj[i].selected=true;
}

}
// alert("sdfsdf");
//看是否有回调函数，如果有就调用
var callback=fdValueObj.attr("callback");
if(callback!=undefined && callback!=""){
eval("opener."+callback);
}
parent.$('#win').window('close');
//window.close();
}

 视图js

//选中
function onCheck(index,rowData){
var userid=rowData.LABLENAME;
var username=rowData.LABLENAME;
parent.add(userid,username);
}

//取消选中
function onUncheck(index,rowData){
parent.remove(rowData.LABLENAME);
}

//添加grid中的全部用户
function addall(){
var rows=$("#box").datagrid('getRows');
for(var i=0;i<rows.length;i++){
var userid=rows[i].LABLENAME;
var username=rows[i].LABLENAME;
parent.add(userid,username);
}
}

//添加grid中选中的用户
function addsel(){
var rows = $('#box').datagrid('getSelections');
for(var i=0;i<rows.length;i++){
var userid=rows[i].LABLENAME;
var username=rows[i].LABLENAME;
parent.add(userid,username);
}
}

//初始化为默认选中
function onLoadSuccess(data){
for(var i=0;i<data.rows.length;i++){
var userid=data.rows[i].LABLENAME;
parent.$("#UserList option").each(function(){
if($(this).val() == userid){ $('#box').datagrid('selectRow',i);}
}
);
}
}