两个listbox 无刷新互动
页面代码:
<table border="0" cellpadding="0" cellspacing="0" style="width: 32%">
<tr>
<td>
<asp:ListBox ID="lbLeft" runat="server" Width="150px" Height="200" DataTextField="Name" DataValueField="ID" SelectionMode="Multiple"></asp:ListBox>
</td>
<td><input id="btnAll" onclick="SelectAll()" type="button" class="C_input02" value=">>" />
<br /><br />
<input id="btnAdd" onclick="SelectOne()" type="button" class="C_input02" value=">" /><br /><br />
<input id="btnDel" onclick="DelOne()" type="button" class="C_input02" value="<" /><br /><br />
<input id="btnDAll" onclick="DelAll()" type="button" class="C_input02" value="<<" />
</td>
<td>
<asp:ListBox ID="lbRight" runat="server" Width="150px" SelectionMode="Multiple" Height="200"></asp:ListBox>
</td>
</tr>
</table>
<input id="txtProvider" runat="server" style="display:none" />
javascript代码:
<script type="text/javascript">
function SelectAll()
{
var lst1=window.document.getElementByIdx_x_x_x("<%=lbLeft.ClientID %>");
var length = lst1.options.length;
var string = window.document.getElementByIdx_x_x_x("<%=txtProvider.ClientID %>")
for(var i=0;i<length;i++)
{
var v = lst1.options[i].value;
var t = lst1.options[i].text;
var lst2=window.document.getElementByIdx_x_x_x("<%=lbRight.ClientID %>");
lst2.options[i] = new Option(t,v,true,true);
string.value+=v+",";
}
} function DelAll()
{
var lst2=window.document.getElementByIdx_x_x_x("<%=lbRight.ClientID %>");
var string = window.document.getElementByIdx_x_x_x("<%=txtProvider.ClientID %>")
var length = lst2.options.length;
for(var i=length;i>0;i--)
{
lst2.options[i-1].parentNode.removeChild(lst2.options[i-1]);
}
string.value = "";
} function SelectOne()
{
var string = window.document.getElementByIdx_x_x_x("<%=txtProvider.ClientID %>")
var lst1=window.document.getElementByIdx_x_x_x("<%=lbLeft.ClientID %>");
var lst2=window.document.getElementByIdx_x_x_x("<%=lbRight.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.getElementByIdx_x_x_x("<%=lbRight.ClientID %>");
var string = window.document.getElementByIdx_x_x_x("<%=txtProvider.ClientID %>")
var lstindex=lst2.selectedIndex;
if(lstindex>=0)
{
var v = lst2.options[lstindex].value+";";
var va = lst2.options[lstindex].value+",";
lst2.options[lstindex].parentNode.removeChild(lst2.options[lstindex]);
string.value = string.value.replace(va,"");
}
}
</script>
兼容IE、火狐
两个listbox 无刷新互动的更多相关文章
- ajax实现无刷新两级联动DropDownList
ajax实现的无刷新三级联动 http://zhangyu028.cnblogs.com/articles/310568.html 本文来自小山blog:http://singlepine.cnblo ...
- ASP_NET实现界面无刷新的DropdownList两级联动效果
所谓DropdownList联动,也就是在选一个DropdownList的时候使另外一个DropdownList的内容更新(如选省份时显示所属城市),按常规的方法那就是在第一个DropdownList ...
- JQuery实现无刷新下拉加载图片
最近做的一个项目需要做页面无刷新下拉加载图片,调研了一番,大多都采用检测滚动条达到底部,然后利用ajax加载下一页数据对页面数据进行添加,根据这一逻辑,自己写了一个,具体代码如下: JQu ...
- mvc file控件无刷新异步上传操作
前言 上传文件应该是很常见必不可少的一个操作,网上也有很多提供的上传控件.今天遇到一个问题:input控件file无法进行异步无刷新上传.真真的感到别扭.所以就尝试这去处理了一下.主要分三个部分:上传 ...
- 利用history实现无刷新跳转界面
看标题是不是感觉很拽的样子,其实没什么啦,也就是时下常说的单页面应用.这种web形式在如今的移动端十分流行,毕竟在移动端频繁得去刷新界面不是很友好,而且还费流量.今天我们要做一个小的app(移动端), ...
- jQuery AJAX 网页无刷新上传示例
新年礼,提供简单.易套用的 jQuery AJAX 上传示例及代码下载.后台对文件的上传及检查,以 C#/.NET Handler 处理 (可视需要改写成 Java 或 PHP). 有时做一个网站项目 ...
- ajax 无刷新上传
最近要做微信的图文上传,因为一个图文了表中可以有多个图文,所有按钮需要随时添加,所以做了一种无刷新上传的方法. 首先我们要在html页面中写上这样的几段代码 javascript: $(functio ...
- 使用AjaxPro实现无刷新更新数据
需求 在一个页面动态无刷新的更新后台得到的数据.要想无刷新的更新数据,需要使用Javascript能够获取后台返回的数据,然后通过第三方Javascript库(JQuery等)动态更新web页面DOM ...
- asp.net Ajax刷新和无刷新的区别
无刷新按钮btnShua 刷新按钮btnWu label控件和calendar控件在updatePanel中显示 两个button按钮在div中 <%@ Page Language=" ...
随机推荐
- FineUI模拟树下拉列表
模拟树的下拉列表 很多时候,我们希望在下拉列表中显示简单树状的层次结构,在菜单设置.机构设置等场景下这个需求尤为突出.也是基于项目需求的考虑,FineUI增加了模拟树的下拉列表的功能,显示效果如下所示 ...
- eclipse安装egit上传和clone项目到github
一.eclipse安装egit插件 help->new install new software->add location输入http://download.eclipse.org/ ...
- angular 指令梳理 —— checkBox
checkBox 持久化数据为 逗号分割 /** * 功能说明: * htCheckbox 指令用于收集checkbox数据. * 在页面中使用 * 属性指令:ht-checkbox * 对应的值为s ...
- [原创]旧事重提:只配置参数实现OAuth2登录
其实这个组件写出来很长时间了,有几个月吧,一直在 MrHuo工作室 上放着,一直说要整理,太忙没时间. 另外,关于OAuth2的一些基础内容还请从网上找找资料,太多了,写的累赘. 废话不多说,先上图 ...
- 在windows中搭建php开发环境
一.wampserver wampserver是一个安装集成包,包含了开发所需的apache,mysql,php,简单方便. 下载地址 http://www.xiazaiba.com/html/279 ...
- 【笔记】shell下的主要工具
shell 下有很多工具是非常好的辅助. 一.自我精进的途径 1.help / --help :简要的帮助说明: help 是针对 shell 内建功能的帮助, gnu工具一般为 "程序名 ...
- windows安装配置mysql-5.7.13-winx64方法
1.mysql-5.7.13-winx64.zip下载 官方下载地址:http://dev.mysql.com/downloads/mysql/ 2.解压到D:\mysql\mysql-5.7.13- ...
- oracle的resetlogs机制浅析
oracle的resetlogs机制浅析 alter database open resetlogs 这个命令我想大家都很熟悉了,那有没有想过这个resetlogs选项为什么要用?什么时候用?它的原理 ...
- hdu 2807 The Shortest Path
http://acm.hdu.edu.cn/showproblem.php?pid=2807 第一次做矩阵乘法,没有优化超时,看了别人的优化的矩阵乘法,就过了. #include <cstdio ...
- LeetCode_Unique Binary Search Trees
Given n, how many structurally unique BST's (binary search trees) that store values 1...n? For examp ...