再求次用JS操作ListBox

wfcfan 2007-05-15 10:43:08

上次孟老大的那个js不是很好用，用在asp.net控件上有时候还会报错，
请大家帮帮我

两个listbox可以互移（多项）

...全文

297 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

garybo 2007-05-18

打赏
举报

纯粹用js代码来互相移动listbox不能提交到后台的。

最好用个隐藏控件来保存是不是双击了listbox的item，然后在服务器端处理互移。
关键代码

隐藏控件代码：
<input id="Dbclickflag" type="hidden" value="false" name="Dbclickflag" runat="server"></td>
JAVASCRIPT：Dbclickflag是隐藏控件的clientid
function listbox_ondblclick(Dbclickflag){
var theForm = document.forms['aspnetForm'];
if (!theForm) {
theForm = document.aspnetForm;
}
Dbclickflag.value="true";
theForm.submit();
}

然后在后台页面里面为listbox加上一个属性
listbox.Attributes.Add("onDblClick", "listbox_ondblclick("+this.Dbclickflag.ClientID+")");

每次在page_load的if（IsPostBack）里面做一下判断，如果Dbclickflag的value是true，说明双击了listbox，然后做移动

KKND2006 2007-05-15

打赏
举报

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> </TITLE>
<script language="javascript">
function Change(inObj1,inObj2)
{
var CtlBox1 = document.all.item(inObj1);
var CtlBox2 = document.all.item(inObj2);

if(CtlBox2.selectedIndex < 0)
{
return;
}
CtlBox1.appendChild(CtlBox2.options(CtlBox2.selectedIndex));
}

function box3_onchage()
{
var CtlBox = document.all.item("box3");
window.status = CtlBox.options(CtlBox.selectedIndex).innerText;
}

function ClearSelect()
{
var CtlBox = document.all.item("box3");

while(CtlBox.options.length > 0)
{
alert(CtlBox.options(CtlBox.selectedIndex).title);
CtlBox.options.remove(0);
}
}

function AddAll()
{
var CtlBox1 = document.all.item("box1");
var CtlBox2 = document.all.item("box2");

while(CtlBox1.options.length > 0)
{
CtlBox2.appendChild(CtlBox1.options(0));
}
}
</script>
<BODY>
<SELECT NAME="box1" size="6" multiple="multiple" ondblclick="Change('box2','box1');">
<OPTION value="a1">a1</OPTION>
<OPTION value="a2">a2</OPTION>
<OPTION>a3</OPTION>
<OPTION>a4</OPTION>
<OPTION>a5</OPTION>
<OPTION>a6</OPTION>
</SELECT>

<INPUT TYPE="button" onclick="AddAll();" value="AddAll" title="AddAll">

<SELECT id="box2" size="6" multiple="multiple" ondblclick="Change('box1','box2');">
</SELECT>

<SELECT NAME="box3" size="1" onchange="box3_onchage();" title="aaa">
<OPTION title="ca1">c1</OPTION>
<OPTION title="ca2">c2</OPTION>
<OPTION title="ca3">c3</OPTION>
<OPTION title="ca4">c4</OPTION>
<OPTION title="ca5">c5</OPTION>
<OPTION title="ca6">c6</OPTION>
</SELECT>

<INPUT TYPE="button" onclick="ClearSelect();" value="Clear" title="aaa">
</BODY>
</HTML>