JavaScript 弹出窗体点击按钮返回选择数据的实现


Posted in Javascript onApril 01, 2010

首先是父页面的代码:

<head runat="server"> 
<title>无标题页</title> 
<%-- <script type="text/javascript"> 
function openDia() { 
var returned = window.showModalDialog("Default4.aspx?" + (new Date()), window); 
if (returned) { 
document.getElementById("ret").innerHTML = returned; 
} 
else { 
document.getElementById("ret").innerHTML = ""; 
} 
} 
</script> --%> 
<script type="text/javascript"> 
function openDia(){ 
var returned = window.showModalDialog("Default3.aspx?" + (new Date()), window); 
if (returned){ 
document.getElementById("tbtext").value = returned; 
} 
else{ 
document.getElementById("tbtext").value = ""; 
} 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div id="ret"> 
<input id="tbtext" type="text" value="" onclick="openDia();return false;" /> 
</div> 
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="openDia();return false;" /> 
<input id="Hidden1" type="hidden" runat="server" /> 
</form> 
</body> 
</html>

关于加上那个 (new Data()) 是要避免showModalDialog页面自动缓存的问题,导致第二次打开页面,数据没有被刷新,这是因为showModalDialog页面如果每次的URL一样的话,它会自动显示以前在缓存里面的数据。
接着是子页面Default3.aspx的代码:
<head runat="server"> 
<title>无标题页</title> 
<script type="text/javascript"> 
function getSelected(data) { 
var str = data; 
window.returnValue = str.toString(); 
window.close(); 
} 
</script> 
<base target="_self"/> 
</head> 
<body> 
<form id="form1" runat="server" target=""> 
<div> 
<asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound"> 
<Columns> 
<asp:TemplateField> 
<ItemTemplate> 
<asp:LinkButton id="lnkSelect2" runat="server" Text="Select" > </asp:LinkButton> 
</ItemTemplate> 
</asp:TemplateField> 
</Columns> 
</asp:GridView> 
 </div> 
</form> 
</body> 
</html>

Default3.aspx里面有一个gridview控件,数据绑定(自己去绑定,代码就不贴上来了)好后,就是选择自己需要的数据了。
Default3.aspx.cs:
[code]
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
LinkButton b = (LinkButton)e.Row.FindControl("lnkSelect2");
b.Attributes.Add("OnClick", "javascript:getSelected('" + e.Row.Cells[1].Text + "');");
}
}
[html]
其中Default3.aspx中<head></head>之间的<base target="_self"/>和<form target="">作用是可以避免子页面点击选择按钮后弹出第三个窗体。
例子就这样,具体还是要根据自己的需求s去体验和改进。
Javascript 相关文章推荐
javascript 读取XML数据,在页面中展现、编辑、保存的实现
Oct 27 Javascript
javascript 利用Image对象实现的埋点(某处的点击数)统计
Dec 28 Javascript
javascript中全局对象的parseInt()方法使用介绍
Dec 19 Javascript
当jQuery1.7遇上focus方法的问题
Jan 26 Javascript
JavaScript 控制字体大小设置的方法
Nov 23 Javascript
详解angular 中的自定义指令之详解API
Jun 20 Javascript
knockoutjs模板实现树形结构列表
Jul 31 Javascript
jfinal与bootstrap的登出实战详解
Nov 27 Javascript
在node中使用jwt签发与验证token的方法
Apr 03 Javascript
vue+element搭建后台小总结 el-dropdown下拉功能
Apr 10 Javascript
angula中使用iframe点击后不执行变更检测的问题
May 10 Javascript
使用js获取身份证年龄的示例代码
Dec 11 Javascript
js 实现打印网页中定义的部分内容的代码
Apr 01 #Javascript
js prototype截取字符串函数
Apr 01 #Javascript
javascript getElementsByClassName函数
Apr 01 #Javascript
JS getStyle获取最终样式函数代码
Apr 01 #Javascript
Javascript 通过json自动生成Dom的代码
Apr 01 #Javascript
JS中confirm,alert,prompt函数使用区别分析
Apr 01 #Javascript
JavaScript中实现块作用域的方法
Apr 01 #Javascript
You might like
第七节 类的静态成员 [7]
2006/10/09 PHP
web方式ftp
2006/10/09 PHP
php 3行代码的分页算法(求起始页和结束页)
2009/10/21 PHP
PHP统计目录中文件以及目录中目录大小的方法
2016/01/09 PHP
详解PHP swoole process的使用方法
2017/08/26 PHP
PHP实现一个限制实例化次数的类示例
2019/09/16 PHP
PHP连接MySQL数据库三种实现方法
2020/12/10 PHP
DEFER怎么用?
2006/07/01 Javascript
Extjs 几个方法的讨论
2010/01/28 Javascript
JavaScript arguments 多参传值函数
2010/10/24 Javascript
利用NodeJS的子进程(child_process)调用系统命令的方法分享
2013/06/05 NodeJs
两种不同的方法实现js对checkbox进行全选和反选
2014/05/13 Javascript
编程语言JavaScript简介
2014/10/16 Javascript
详细解读JavaScript编程中的Promise使用
2015/07/27 Javascript
Javascript的表单验证-提交表单
2016/03/18 Javascript
jQuery实现的瀑布流加载效果示例
2016/09/13 Javascript
深入理解Javascript中的观察者模式
2017/02/20 Javascript
Vue组件之全局组件与局部组件的使用详解
2017/10/09 Javascript
简单实现vue验证码60秒倒计时功能
2017/10/11 Javascript
jquery点击回车键实现登录效果并默认焦点的方法
2018/03/09 jQuery
VUE-cli3使用 svg-sprite-loader
2018/10/20 Javascript
vue-cli 3.0 版本与3.0以下版本在搭建项目时的区别详解
2018/12/11 Javascript
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
2019/11/07 jQuery
详解ES6中class的实现原理
2020/10/03 Javascript
JavaScript实现点击出现子菜单效果
2021/02/08 Javascript
[38:41]2014 DOTA2国际邀请赛中国区预选赛 LGD VS CNB
2014/05/22 DOTA
Python多进程机制实例详解
2015/07/02 Python
python2.7无法使用pip的解决方法(安装easy_install)
2018/04/03 Python
python去除扩展名的实例讲解
2018/04/23 Python
python安装dlib库报错问题及解决方法
2020/03/16 Python
详解python logging日志传输
2020/07/01 Python
python如何爬取动态网站
2020/09/09 Python
python中remove函数的踩坑记录
2021/01/04 Python
搞笑爱情保证书
2014/04/29 职场文书
优秀班主任事迹材料
2014/12/16 职场文书
2015年安全生产目标责任书
2015/01/29 职场文书