两个ListBox之间的交互,无疑有两个办法:一个是在服务器端与客户端不停的PostBack,这无疑会大大降低效率。这是就体现出JavaScript在客户端的优势。下面介绍一下,又不足的地方希望大家指出!
下面是JS代码:用四个函数分别对应四个按钮,完成该功能。
<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />--><script type="text/javascript">
function SelectAll()
{
var lst1=window.document.getElementById("<%=lb_Sourse.ClientID %>");
var length = lst1.options.length;
var string = window.document.getElementById("<%=hf_NewName.ClientID %>")
for(var i=0;i<length;i++)
{
var v = lst1.options[i].value;
var t = lst1.options[i].text;
var lst2=window.document.getElementById("<%=lb_NewName.ClientID %>");
lst2.options[i] = new Option(t,v,true,true);
string.value+=v;
}
}
function DelAll()
{
var lst2=window.document.getElementById("<%=lb_NewName.ClientID %>");
var length = lst2.options.length;
for(var i=length;i>0;i--)
{
lst2.options[i-1].parentNode.removeChild(lst2.options[i-1]);
}
}
function SelectOne()
{
var string = window.document.getElementById("<%=hf_NewName.ClientID %>")
var lst1=window.document.getElementById("<%=lb_Sourse.ClientID %>");
var lst2=window.document.getElementById("<%=lb_NewName.ClientID %>");
var lstindex=lst1.selectedIndex;
var length = lst2.options.length;
var isExists = false;
if(lstindex<0)
return;
else if(length != null)
{
for(var i=0;i < length; i++)
{
if(lst2.options[i].text == lst1[lstindex].text&&lst2.options[i].value == lst1[lstindex].value)
{
isExists = true;
}
}
}
else
{
return;
}
if (isExists == false)
{
var v = lst1.options[lstindex].value;
var t = lst1.options[lstindex].text;
lst2.options[lst2.options.length] = new Option(t,v,true,true);
string.value+=v;
}
else
{
alert("所选条目已经存在");
return false;
}
}
function DelOne()
{
var lst2=window.document.getElementById("<%=lb_NewName.ClientID %>");
var lstindex=lst2.selectedIndex;
if(lstindex>=0)
{
var v = lst2.options[lstindex].value+";";
lst2.options[lstindex].parentNode.removeChild(lst2.options[lstindex]);
}
}
</script>
需要解释的是由于JS脚本是在客户端执行的,因此服务器端控件是无法调用JS的,由于ID无法被找到,但用<%=lb_NewName.ClientID %>的方法就巧妙的解决得该问题,是asp控件拥有客户端id,这样就可以调用了。
希望对大家有所帮助!
分享到:
相关推荐
c# javascript 操作 listBox控件
主要介绍了基于javascript实现listbox左右移动的相关资料,以一个完整的实例代码分析了js实现listbox左右移动的相关技巧,感兴趣的小伙伴们可以参考一下
在1月3日Javascript控件基础上更新,ListBox增加了设置选择功能,TreeView增加了级联选择功能。
Delphi 两个listbox之间内容转移,支持选中转移和全部转移
双击移除LISTBOX选项[服务器控件],无刷新,用JS来实现。
本文实例讲述了JavaScript控制listbox列表框的项目上下移动的方法。分享给大家供大家参考。具体分析如下: 这段JS代码可以控制listbox内的元素向上或者向下移动,这个功能非常有用。下面是详细的代码 代码如下:...
VB.NET ListBox内容用鼠标拖动和按钮移动实现排序功能 VS2010
获取ListBox内容VB经典源码,别的地方都找不到,本站长期提供原创源码
WPF listBox 漂亮的listBOX
1。 html部分: 代码如下: ”0″ borderColorDark=”#ffffff” cellPadding=”3″ width=”460″ align=”left” borderColorLight=”#000000″ border=...runat=”server”> </td> <td align=”center” width=”6
c# listbox显示数据库的内容c# listbox显示数据库的内容
该工程实现了可以显示多行内容的ToolTip的ListBox,继承CWnd实现了一个自定义的ToolTip类,再继承CListBox实现了一个自定义的ListBox类
ListBox实现拖拽排序功能,ListBox拖拽实现原理,排序功能
本文介绍如何使用JavaScript创建ListBox控件。
使用javascript操作listbox
通过继承UserControl控件,重新写了一个可编辑的ListBox,它可以实现直接在框内点击添加,修改等。
VC 为ListBox文字超出时自动添加Tip提示,当列表某一行的内容超出规定范围时,列表一般会将其隐藏,用户无法看到,此时智能提示功能会开启,鼠标放在此行上面,会显示出隐藏掉的内容,完整显示ListBox中的图像,拉回...