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实现给出的盒子的序列是否可连为一矩型
Aug 30 Javascript
从零开始学习jQuery (六) jquery中的AJAX使用
Feb 23 Javascript
JavaScript中使用Math.floor()方法对数字取整
Jun 15 Javascript
jQuery实现的图文高亮滚动切换特效实例
Aug 10 Javascript
JavaScript对HTML DOM使用EventListener进行操作
Oct 21 Javascript
BootStrap中的table实现数据填充与分页应用小结
May 26 Javascript
jQuery控制元素隐藏和显示
Mar 03 Javascript
关于react中组件通信的几种方式详解
Dec 10 Javascript
如何在 JavaScript 中更好地利用数组
Sep 27 Javascript
Vue 报错TypeError: this.$set is not a function 的解决方法
Dec 17 Javascript
Node.js API详解之 module模块用法实例分析
May 13 Javascript
JavaScript前端开发时数值运算的小技巧
Jul 28 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中动态HTML的输出技术
2006/10/09 PHP
记录mysql性能查询过程的使用方法
2013/05/02 PHP
php获取百度收录、百度热词及百度快照的方法
2015/04/02 PHP
PHP数组与对象之间使用递归实现转换的方法
2015/06/24 PHP
js去除空格的12种实用方法
2013/11/08 Javascript
写出高效jquery代码的19条指南
2014/03/19 Javascript
JavaScript使用Math.Min返回两个数中较小数的方法
2015/04/06 Javascript
javascript实现英文首字母大写
2015/04/23 Javascript
jquery实现的缩略图预览滑块实例
2015/06/25 Javascript
详解jQuery的表单验证插件--Validation
2016/12/21 Javascript
bootstrap table分页模板和获取表中的ID方法
2017/01/10 Javascript
原生js实现下拉框功能(支持键盘事件)
2017/01/13 Javascript
JS中实现函数return多个返回值的实例
2017/02/21 Javascript
jQuery实现的手风琴侧边菜单效果
2017/03/29 jQuery
深入理解Vue transition源码分析
2017/07/30 Javascript
vue发送ajax请求详解
2018/10/09 Javascript
JavaScript函数的特性与应用实践深入详解
2018/12/30 Javascript
详解如何使用nvm管理Node.js多版本
2019/05/06 Javascript
jQuery实现回到顶部效果
2020/10/19 jQuery
[05:00]第二届DOTA2亚洲邀请赛主赛事第三天比赛集锦.mp4
2017/04/04 DOTA
python解析xml模块封装代码
2014/02/07 Python
python使用内存zipfile对象在内存中打包文件示例
2014/04/30 Python
Python爬虫爬取美剧网站的实现代码
2016/09/03 Python
windows下安装Python和pip终极图文教程
2017/03/05 Python
python迭代dict的key和value的方法
2018/07/06 Python
使用Tensorflow将自己的数据分割成batch训练实例
2020/01/20 Python
python如何爬取动态网站
2020/09/09 Python
世界上最大的各式箱包网络零售店:eBag
2016/07/21 全球购物
技校教师求职简历的自我评价
2013/10/20 职场文书
自我评价如何写好?
2014/01/05 职场文书
群众路线教育实践活动自我剖析思想汇报
2014/10/04 职场文书
个人公司授权委托书范本
2014/10/12 职场文书
教师考核评语大全
2014/12/31 职场文书
行政诉讼答辩状
2015/05/21 职场文书
《比的意义》教学反思
2016/02/18 职场文书