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 相关文章推荐
php对mongodb的扩展(初识如故)
Nov 11 Javascript
判断一个变量是数组Array类型的方法
Sep 16 Javascript
jquery中键盘事件小结
Feb 24 Javascript
移动端横屏的JS代码(beta)
May 16 Javascript
AngularJS基础 ng-open 指令简单实例
Aug 02 Javascript
分享JS数组求和与求最大值的方法
Aug 11 Javascript
JS实现随机颜色的3种方法与颜色格式的转化
Jan 05 Javascript
浅析JS中的 map, filter, some, every, forEach, for in, for of 用法总结
Mar 29 Javascript
jQuery实现获取动态添加的标签对象示例
Jun 28 jQuery
vue mounted 调用两次的完美解决办法
Oct 29 Javascript
使用Three.js实现太阳系八大行星的自转公转示例代码
Apr 09 Javascript
js判断鼠标移入移出方向的方法
Jun 24 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
一个用于网络的工具函数库
2006/10/09 PHP
php使用ob_flush不能每隔一秒输出原理分析
2015/06/02 PHP
Laravel5框架自定义错误页面配置操作示例
2019/04/17 PHP
jquery绑定原理 简单解析与实现代码分享
2011/09/06 Javascript
window.location.reload()方法刷新页面弹出要再次显示该网页对话框
2013/04/24 Javascript
JS生成随机字符串的多种方法
2014/06/10 Javascript
js实现window.open不被拦截的解决方法汇总
2014/10/30 Javascript
使用travis-ci如何持续部署node.js应用详解
2017/07/30 Javascript
解决vue-cli webpack打包开启Gzip 报错问题
2019/07/24 Javascript
JavaScript 截取字符串代码实例
2019/09/05 Javascript
使用Layer组件弹出多个对话框(非嵌套)与关闭及刷新的例子
2019/09/25 Javascript
JavaScript实现栈结构Stack过程详解
2020/03/07 Javascript
javascript实现时钟动画
2020/12/03 Javascript
[01:13:46]iG vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
netbeans7安装python插件的方法图解
2013/12/24 Python
Python的Flask框架及Nginx实现静态文件访问限制功能
2016/06/27 Python
使用 Visual Studio Code(VSCode)搭建简单的Python+Django开发环境的方法步骤
2018/12/17 Python
python 实现得到当前时间偏移day天后的日期方法
2018/12/31 Python
Python提取支付宝和微信支付二维码的示例代码
2019/02/15 Python
Python常用的json标准库
2019/02/19 Python
使用python切片实现二维数组复制示例
2019/11/26 Python
Django之form组件自动校验数据实现
2020/01/14 Python
python+requests实现接口测试的完整步骤
2020/10/27 Python
matplotlib 范围选区(SpanSelector)的使用
2021/02/24 Python
小橄榄树:Le Petit Olivier
2018/04/23 全球购物
extern是什么意思
2016/03/10 面试题
给排水工程师岗位职责
2013/11/21 职场文书
银行实习的自我鉴定
2013/12/10 职场文书
《雪地里的小画家》教学反思
2014/02/22 职场文书
股东合作协议书
2014/04/14 职场文书
篮球比赛策划方案
2014/06/05 职场文书
离婚协议书怎么写
2015/01/26 职场文书
库房管理员岗位职责
2015/02/12 职场文书
交通事故代理词范文
2015/05/23 职场文书
Python如何把不同类型数据的json序列化
2021/04/30 Python
在 SQL 语句中处理 NULL 值的方法
2021/06/07 SQL Server