代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MulitiSelect.aspx.cs" Inherits="MulitiSelect" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><%=ResourceHelper.GetString("IM.SMS.smsMulitiSelect")/*查询人员*/%></title>
<base target="_self" />
<style type="text/css">
select
{
border:0px;
width: 290px;
height:342px;
position:relative;
top:-3px;
left:-3px;
}
.lstContainer
{
position:relative;
border:1px solid #7F9DB9;
padding:0px;
margin:0px;
width:290px;
height:338px;
z-index:10;
overflow:hidden;
margin-bottom:5px;
}
.selectUnable
{
color:#999;
}
</style>
</head>
<body>
<form id="form1" runat="server" defaultbutton="btnSearch">
<div id="content_Select">
<TABLE cellSpacing=1 width="100%" cellpadding="0" class="tb_input">
<tr>
<td nowrap class="td_title" height="25px" width="12%"><%=ResourceHelper.GetString("IM.SMS.SearchKeyWord")%>
</td>
<td>
<input name="Input2" id="Input" style="width: 150px" runat="server" maxlength="20"/>
<asp:Button ID="btnSearch" runat="server"
OnClick="btnSearch_ServerClick"
OnClientClick="setSelectedReciever();"
CssClass="button"
Text="查询"/>
</td>
</tr>
</table>
<TABLE cellSpacing=1 width="100%" cellpadding="0" class="tb_input">
<tr>
<td height="10" align="left" valign="top" nowrap="nowrap" class="td_title">
<asp:Literal ID="lblWaitSelect" Text="可选择的人员" runat="server"></asp:Literal>(<label id="lblCanSelect" runat="server"></label>)</td>
<td width="10%" rowspan="2" align="center">
<input name="Submit" id="btnAdd" type="button" class="button_s" value="> " />
<br /><br />
<input name="Submit3" id="btnRemove" type="button" class="button_s" value="< " />
</td>
<td height="10" align="left" valign="top" nowrap="nowrap" class="td_title">
<asp:Literal ID="lblHaveSelect" Text="已选择的人员" runat="server"></asp:Literal>(<label id="lblSelected" runat="server"></label>)</td>
</tr>
<tr>
<td width="45%" rowspan="2" align="left" valign="top" class="detail" style="padding: 5px 5px 0px 5px;">
<div class="lstContainer">
<select name="list1" id="lstCanSelect" multiple="true" size="4"
runat="server"
ondblclick="doLeftSelect();">
</select>
</div>
</td>
<td width="45%" align="left" valign="top" class="detail" style="padding: 5px 5px 0px 5px">
<div class="lstContainer">
<select name="list2" id="lstSelected" multiple="true" size="4"
runat="server"
ondblclick="doRightSelect();">
</select>
</div>
</td>
</tr>
</table>
<div style="margin-top: 5px; text-align: right">
<input name="Submit3" id="setSelectedNumber" type="button" class="IM_button" runat="server" value="确定"
onclick="window.close()"/>
<input name="Submit3" id="btnCancel" type="button" class="IM_button" value="取消" runat="server" onclick="OKParentWindow();" />
</div>
<div>
<input type="hidden" runat="server" id="lblGroupType"/>
<input type="hidden" runat="server" id="strSelectedReciever"/>
<input type="hidden" runat="server" id="FirstLoad" value="1"/>
<input type="hidden" runat="server" id="GroupMemeberNo" />
</div>
</div>
<script type="text/javascript">
var arrSelectedReciever = new Array(); // 保存所有选择的人员
var objStrSelectedReciever = document.getElementById("strSelectedReciever").value;
var groupMemeberNo = "";
if (objStrSelectedReciever.length > 0)
{
var arrStrSelectedReciever = objStrSelectedReciever.split(",");
for (var i = 0, n = arrStrSelectedReciever.length; i < n; i++)
{
arrSelectedReciever.push(arrStrSelectedReciever[i]);
}
}
if( document.getElementById("FirstLoad").value == "1")
{
document.getElementById("FirstLoad").value = "0";
var rightList = document.getElementById("lstSelected");
var opener = window.dialogArguments;
if(opener)
{
var objGroupPerson = opener.document.all.groupPerson; // 父窗口群组人员列表框
if (objGroupPerson && objGroupPerson.value.length > 0)
{
var val = objGroupPerson.value;
var arrStrSelectedReciever = val.substring(val.length-1,length).split(",");
var regMobileNo = /^\d+$/;
for (var i = 0,index = 0, n = arrStrSelectedReciever.length; i < n; i++)
{
if (!regMobileNo.test(arrStrSelectedReciever[i]))
{
rightList.options[index++] = new Option(arrStrSelectedReciever[i],arrStrSelectedReciever[i].split("-")[1]);
arrSelectedReciever.push(arrStrSelectedReciever[i]);
}
else
{
groupMemeberNo += arrStrSelectedReciever[i] + ",";
}
}
document.getElementById("GroupMemeberNo").value = groupMemeberNo;
}
}
}
document.getElementById("lblCanSelect").innerText = document.getElementById("lstCanSelect").options.length;
document.getElementById("lblSelected").innerText = document.getElementById("lstSelected").options.length;
</script>
<script type="text/javascript">
var leftList = document.getElementById("lstCanSelect");
var rightList = document.getElementById("lstSelected");
//====================== 事件 ================================
document.getElementById("setSelectedNumber").onclick = SetSelectedNumber;
// 设置结果
function SetSelectedNumber()
{
var groupType = document.getElementById("lblGroupType").value;
if(groupType == "1")
{
if(rightList.options.length > 200)
{
alert('<%= ResourceHelper.GetString("IM.SMS.CustomGroupMaxMemberCount") %>');
return;
}
}
else if(groupType == "2")
{
if(rightList.options.length > 300)
{
alert('<%= ResourceHelper.GetString("IM.SMS.PublicGroupMaxMemberCount") %>');
return;
}
}
else
{
//选择人数是否为100以内
if(rightList.options.length > 100)
{
alert('<%= ResourceHelper.GetString("IM.SMS.NormalSelectMaxCount") %>');
return;
}
}
var smsRecieveList = "";
var opener = window.dialogArguments;
//如果直接打开窗口
if(!opener)
{
return;
}
var parentRevieve = opener.document.all.txtSmsRecieve;
var parentGroup = opener.document.all.groupPerson;
smsRecieveList = arrSelectedReciever.join();
if(smsRecieveList.length > 0)
{
smsRecieveList += ",";
}
if(parentRevieve)
{
var sourceRecieverValue = parentRevieve.value;
var len = sourceRecieverValue.length;
var lastChar = sourceRecieverValue.substring(len-1,len);
if( lastChar && lastChar != ",")
{
parentRevieve.value += "," + smsRecieveList;
}
else
{
parentRevieve.value += smsRecieveList;
}
}
if(parentGroup)
{
smsRecieveList = smsRecieveList + document.getElementById("GroupMemeberNo").value;
parentGroup.value = smsRecieveList;
}
OKParentWindow();
}
// 设置全部选择人员
function setSelectedReciever()
{
var objStrSelectedReciever = document.getElementById("strSelectedReciever");
objStrSelectedReciever.value = arrSelectedReciever.join();
}
//添加到选择列
document.getElementById("btnAdd").onclick = function()
{
var lastIndex = 0;
var ExistsItem = false;
for(var i = 0, n = leftList.options.length; i < n; i++)
{
if(leftList.options[i].selected && leftList.options[i].value != "")
{
var addResult = AddOption(rightList,leftList.options[i]);
if(addResult)
{
arrSelectedReciever.push(leftList.options[i].text);
DeleteSelectItem(leftList,leftList.options[i]);
lastIndex = i;
}
else
{
ExistsItem = true;
lastIndex = i + 1;
continue;
}
setLabel();
setbutton();
i--;
n--;
}
}
if (ExistsItem)
{
alert('<%= ResourceHelper.GetString("IM.SMS.ExistSelected") %>');
}
getNextItemIndex(leftList,lastIndex);
}
//从选择列中删除
document.getElementById("btnRemove").onclick=function()
{
var lastIndex = 0;
var ExistsItem = false;
for(var i = 0, n = rightList.options.length; i < n; i++)
{
if(rightList.options[i].selected && rightList.options[i].value != "")
{
var addResult = AddOption(leftList,rightList.options[i]);
if(addResult)
{
removeFromArrSelectedList(rightList.options[i]); // 从arrSelectedList删除已选择的项
DeleteSelectItem(rightList,rightList.options[i]);
lastIndex = i;
}
else
{
ExistsItem = true;
lastIndex = i + 1;
continue;
}
setLabel();
setbutton();
i--;
n--;
}
}
if (ExistsItem)
{
alert('<%= ResourceHelper.GetString("IM.SMS.ExistSelected") %>');
}
getNextItemIndex(rightList,lastIndex);
}
// 设置列表中下一个可选项
function getNextItemIndex(objSelect,currentIndex)
{
var regEnble = /^\(.+\)\-\d+$/;
for (var i = currentIndex, n = objSelect.options.length; i < n; i++)
{
if (regEnble.test(objSelect.options[i].text))
{
objSelect.selectedIndex = i;
return;
}
}
for (var i = currentIndex - 1; i >= 0 ; i--)
{
if (regEnble.test(objSelect.options[i].text))
{
objSelect.selectedIndex = i;
return;
}
}
}
// 从arrSelectedList删除已选择的项
function removeFromArrSelectedList(objOption)
{
var text = objOption.text;
for (var i = 0, n = arrSelectedReciever.length; i < n; i++)
{
if(text == arrSelectedReciever[i])
{
arrSelectedReciever.splice(i,1);
}
}
}
//====================== 事件结束 ================================
//向列表中添加项
function AddOption(ListControl, item)
{
if (IsExistValue(ListControl,item.value)==false)
{
ListControl.options[ListControl.options.length] = new Option(""+item.text, item.value);
return true;
}
else
{
return false;
}
}
//删除列表中已选定的值
function DeleteSelectItem(fldList, item)
{
fldList.remove(item.index);
}
//设置标签
function setLabel()
{
document.getElementById("lblCanSelect").innerText = leftList.options.length;
document.getElementById("lblSelected").innerText = rightList.options.length;
}
function setbutton()
{
//如果左边列表没有项
if(leftList.options.length==0)
{
document.getElementById("btnAdd").disable=true;
}
else
{
document.getElementById("btnAdd").disable=false;
}
//如果右边列表没有项
if(rightList.options.length==0)
{
document.getElementById("btnRemove").disable=true;
}
else
{
document.getElementById("btnRemove").disable=false;
}
}
// 查询目的列表中是否已经有指定的值 检查 目的框的value
function IsExistValue(fldList,strItem) {
var intFlag=false;
for (var i=0; i < fldList.options.length; ++i) {
if (strItem == fldList.options[i].value) {
intFlag=true;
break;
}
}
return(intFlag)
}
// 左边列表双击
function doLeftSelect()
{
document.getElementById("btnAdd").click();
}
// 右边列表双击
function doRightSelect()
{
document.getElementById("btnRemove").click();
}
//点击了确定，执行这个
function OKParentWindow()
{
var opener = window.dialogArguments;
//如果直接打开窗口
if(!opener)
{
return;
}
if(opener.document.all.HidSubWindow!=null)
{
opener.document.all.HidSubWindow.value="";
}
window.close();
}
//点击右上角的X（关闭自己，清空父窗体）
function ClearParentWindow()
{
//判断是否关闭当前页面
if(document.body.offsetWidth-50 < event.clientX && event.clientY<0)
{
var opener = window.dialogArguments;
//如果直接打开窗口
if(!opener)
{
return;
}
if(opener.document.all.HidSubWindow!=null)
{
opener.document.all.HidSubWindow.value="";
}
}
}
//点击了X，点击了查询
window.onbeforeunload = function()
{
ClearParentWindow();
}
</script>
</form>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><%=ResourceHelper.GetString("IM.SMS.smsMulitiSelect")/*查询人员*/%></title>
<base target="_self" />
<style type="text/css">
select
{
border:0px;
width: 290px;
height:342px;
position:relative;
top:-3px;
left:-3px;
}
.lstContainer
{
position:relative;
border:1px solid #7F9DB9;
padding:0px;
margin:0px;
width:290px;
height:338px;
z-index:10;
overflow:hidden;
margin-bottom:5px;
}
.selectUnable
{
color:#999;
}
</style>
</head>
<body>
<form id="form1" runat="server" defaultbutton="btnSearch">
<div id="content_Select">
<TABLE cellSpacing=1 width="100%" cellpadding="0" class="tb_input">
<tr>
<td nowrap class="td_title" height="25px" width="12%"><%=ResourceHelper.GetString("IM.SMS.SearchKeyWord")%>
</td>
<td>
<input name="Input2" id="Input" style="width: 150px" runat="server" maxlength="20"/>
<asp:Button ID="btnSearch" runat="server"
OnClick="btnSearch_ServerClick"
OnClientClick="setSelectedReciever();"
CssClass="button"
Text="查询"/>
</td>
</tr>
</table>
<TABLE cellSpacing=1 width="100%" cellpadding="0" class="tb_input">
<tr>
<td height="10" align="left" valign="top" nowrap="nowrap" class="td_title">
<asp:Literal ID="lblWaitSelect" Text="可选择的人员" runat="server"></asp:Literal>(<label id="lblCanSelect" runat="server"></label>)</td>
<td width="10%" rowspan="2" align="center">
<input name="Submit" id="btnAdd" type="button" class="button_s" value="> " />
<br /><br />
<input name="Submit3" id="btnRemove" type="button" class="button_s" value="< " />
</td>
<td height="10" align="left" valign="top" nowrap="nowrap" class="td_title">
<asp:Literal ID="lblHaveSelect" Text="已选择的人员" runat="server"></asp:Literal>(<label id="lblSelected" runat="server"></label>)</td>
</tr>
<tr>
<td width="45%" rowspan="2" align="left" valign="top" class="detail" style="padding: 5px 5px 0px 5px;">
<div class="lstContainer">
<select name="list1" id="lstCanSelect" multiple="true" size="4"
runat="server"
ondblclick="doLeftSelect();">
</select>
</div>
</td>
<td width="45%" align="left" valign="top" class="detail" style="padding: 5px 5px 0px 5px">
<div class="lstContainer">
<select name="list2" id="lstSelected" multiple="true" size="4"
runat="server"
ondblclick="doRightSelect();">
</select>
</div>
</td>
</tr>
</table>
<div style="margin-top: 5px; text-align: right">
<input name="Submit3" id="setSelectedNumber" type="button" class="IM_button" runat="server" value="确定"
onclick="window.close()"/>
<input name="Submit3" id="btnCancel" type="button" class="IM_button" value="取消" runat="server" onclick="OKParentWindow();" />
</div>
<div>
<input type="hidden" runat="server" id="lblGroupType"/>
<input type="hidden" runat="server" id="strSelectedReciever"/>
<input type="hidden" runat="server" id="FirstLoad" value="1"/>
<input type="hidden" runat="server" id="GroupMemeberNo" />
</div>
</div>
<script type="text/javascript">
var arrSelectedReciever = new Array(); // 保存所有选择的人员
var objStrSelectedReciever = document.getElementById("strSelectedReciever").value;
var groupMemeberNo = "";
if (objStrSelectedReciever.length > 0)
{
var arrStrSelectedReciever = objStrSelectedReciever.split(",");
for (var i = 0, n = arrStrSelectedReciever.length; i < n; i++)
{
arrSelectedReciever.push(arrStrSelectedReciever[i]);
}
}
if( document.getElementById("FirstLoad").value == "1")
{
document.getElementById("FirstLoad").value = "0";
var rightList = document.getElementById("lstSelected");
var opener = window.dialogArguments;
if(opener)
{
var objGroupPerson = opener.document.all.groupPerson; // 父窗口群组人员列表框
if (objGroupPerson && objGroupPerson.value.length > 0)
{
var val = objGroupPerson.value;
var arrStrSelectedReciever = val.substring(val.length-1,length).split(",");
var regMobileNo = /^\d+$/;
for (var i = 0,index = 0, n = arrStrSelectedReciever.length; i < n; i++)
{
if (!regMobileNo.test(arrStrSelectedReciever[i]))
{
rightList.options[index++] = new Option(arrStrSelectedReciever[i],arrStrSelectedReciever[i].split("-")[1]);
arrSelectedReciever.push(arrStrSelectedReciever[i]);
}
else
{
groupMemeberNo += arrStrSelectedReciever[i] + ",";
}
}
document.getElementById("GroupMemeberNo").value = groupMemeberNo;
}
}
}
document.getElementById("lblCanSelect").innerText = document.getElementById("lstCanSelect").options.length;
document.getElementById("lblSelected").innerText = document.getElementById("lstSelected").options.length;
</script>
<script type="text/javascript">
var leftList = document.getElementById("lstCanSelect");
var rightList = document.getElementById("lstSelected");
//====================== 事件 ================================
document.getElementById("setSelectedNumber").onclick = SetSelectedNumber;
// 设置结果
function SetSelectedNumber()
{
var groupType = document.getElementById("lblGroupType").value;
if(groupType == "1")
{
if(rightList.options.length > 200)
{
alert('<%= ResourceHelper.GetString("IM.SMS.CustomGroupMaxMemberCount") %>');
return;
}
}
else if(groupType == "2")
{
if(rightList.options.length > 300)
{
alert('<%= ResourceHelper.GetString("IM.SMS.PublicGroupMaxMemberCount") %>');
return;
}
}
else
{
//选择人数是否为100以内
if(rightList.options.length > 100)
{
alert('<%= ResourceHelper.GetString("IM.SMS.NormalSelectMaxCount") %>');
return;
}
}
var smsRecieveList = "";
var opener = window.dialogArguments;
//如果直接打开窗口
if(!opener)
{
return;
}
var parentRevieve = opener.document.all.txtSmsRecieve;
var parentGroup = opener.document.all.groupPerson;
smsRecieveList = arrSelectedReciever.join();
if(smsRecieveList.length > 0)
{
smsRecieveList += ",";
}
if(parentRevieve)
{
var sourceRecieverValue = parentRevieve.value;
var len = sourceRecieverValue.length;
var lastChar = sourceRecieverValue.substring(len-1,len);
if( lastChar && lastChar != ",")
{
parentRevieve.value += "," + smsRecieveList;
}
else
{
parentRevieve.value += smsRecieveList;
}
}
if(parentGroup)
{
smsRecieveList = smsRecieveList + document.getElementById("GroupMemeberNo").value;
parentGroup.value = smsRecieveList;
}
OKParentWindow();
}
// 设置全部选择人员
function setSelectedReciever()
{
var objStrSelectedReciever = document.getElementById("strSelectedReciever");
objStrSelectedReciever.value = arrSelectedReciever.join();
}
//添加到选择列
document.getElementById("btnAdd").onclick = function()
{
var lastIndex = 0;
var ExistsItem = false;
for(var i = 0, n = leftList.options.length; i < n; i++)
{
if(leftList.options[i].selected && leftList.options[i].value != "")
{
var addResult = AddOption(rightList,leftList.options[i]);
if(addResult)
{
arrSelectedReciever.push(leftList.options[i].text);
DeleteSelectItem(leftList,leftList.options[i]);
lastIndex = i;
}
else
{
ExistsItem = true;
lastIndex = i + 1;
continue;
}
setLabel();
setbutton();
i--;
n--;
}
}
if (ExistsItem)
{
alert('<%= ResourceHelper.GetString("IM.SMS.ExistSelected") %>');
}
getNextItemIndex(leftList,lastIndex);
}
//从选择列中删除
document.getElementById("btnRemove").onclick=function()
{
var lastIndex = 0;
var ExistsItem = false;
for(var i = 0, n = rightList.options.length; i < n; i++)
{
if(rightList.options[i].selected && rightList.options[i].value != "")
{
var addResult = AddOption(leftList,rightList.options[i]);
if(addResult)
{
removeFromArrSelectedList(rightList.options[i]); // 从arrSelectedList删除已选择的项
DeleteSelectItem(rightList,rightList.options[i]);
lastIndex = i;
}
else
{
ExistsItem = true;
lastIndex = i + 1;
continue;
}
setLabel();
setbutton();
i--;
n--;
}
}
if (ExistsItem)
{
alert('<%= ResourceHelper.GetString("IM.SMS.ExistSelected") %>');
}
getNextItemIndex(rightList,lastIndex);
}
// 设置列表中下一个可选项
function getNextItemIndex(objSelect,currentIndex)
{
var regEnble = /^\(.+\)\-\d+$/;
for (var i = currentIndex, n = objSelect.options.length; i < n; i++)
{
if (regEnble.test(objSelect.options[i].text))
{
objSelect.selectedIndex = i;
return;
}
}
for (var i = currentIndex - 1; i >= 0 ; i--)
{
if (regEnble.test(objSelect.options[i].text))
{
objSelect.selectedIndex = i;
return;
}
}
}
// 从arrSelectedList删除已选择的项
function removeFromArrSelectedList(objOption)
{
var text = objOption.text;
for (var i = 0, n = arrSelectedReciever.length; i < n; i++)
{
if(text == arrSelectedReciever[i])
{
arrSelectedReciever.splice(i,1);
}
}
}
//====================== 事件结束 ================================
//向列表中添加项
function AddOption(ListControl, item)
{
if (IsExistValue(ListControl,item.value)==false)
{
ListControl.options[ListControl.options.length] = new Option(""+item.text, item.value);
return true;
}
else
{
return false;
}
}
//删除列表中已选定的值
function DeleteSelectItem(fldList, item)
{
fldList.remove(item.index);
}
//设置标签
function setLabel()
{
document.getElementById("lblCanSelect").innerText = leftList.options.length;
document.getElementById("lblSelected").innerText = rightList.options.length;
}
function setbutton()
{
//如果左边列表没有项
if(leftList.options.length==0)
{
document.getElementById("btnAdd").disable=true;
}
else
{
document.getElementById("btnAdd").disable=false;
}
//如果右边列表没有项
if(rightList.options.length==0)
{
document.getElementById("btnRemove").disable=true;
}
else
{
document.getElementById("btnRemove").disable=false;
}
}
// 查询目的列表中是否已经有指定的值 检查 目的框的value
function IsExistValue(fldList,strItem) {
var intFlag=false;
for (var i=0; i < fldList.options.length; ++i) {
if (strItem == fldList.options[i].value) {
intFlag=true;
break;
}
}
return(intFlag)
}
// 左边列表双击
function doLeftSelect()
{
document.getElementById("btnAdd").click();
}
// 右边列表双击
function doRightSelect()
{
document.getElementById("btnRemove").click();
}
//点击了确定，执行这个
function OKParentWindow()
{
var opener = window.dialogArguments;
//如果直接打开窗口
if(!opener)
{
return;
}
if(opener.document.all.HidSubWindow!=null)
{
opener.document.all.HidSubWindow.value="";
}
window.close();
}
//点击右上角的X（关闭自己，清空父窗体）
function ClearParentWindow()
{
//判断是否关闭当前页面
if(document.body.offsetWidth-50 < event.clientX && event.clientY<0)
{
var opener = window.dialogArguments;
//如果直接打开窗口
if(!opener)
{
return;
}
if(opener.document.all.HidSubWindow!=null)
{
opener.document.all.HidSubWindow.value="";
}
}
}
//点击了X，点击了查询
window.onbeforeunload = function()
{
ClearParentWindow();
}
</script>
</form>
</body>
</html>
