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 相关文章推荐
JS input 数字验证代码
Jul 30 Javascript
JavaScript 常用函数库详解
Oct 21 Javascript
js 多种变量定义(对象直接量,数组直接量和函数直接量)
May 24 Javascript
用js判断页面是否加载完成实现代码
Dec 11 Javascript
js 验证身份证信息有效性
Mar 28 Javascript
解决html按钮切换绑定不同函数后点击时执行多次函数问题
May 14 Javascript
select隐藏选中值对应的id,显示其它id的简单实现方法
Aug 25 Javascript
arcgis for js 修改infowindow样式的方法
Nov 02 Javascript
ionic实现底部分享功能
May 11 Javascript
js自定义trim函数实现删除两端空格功能
Feb 09 Javascript
Vue2.2.0+新特性整理及注意事项
Aug 22 Javascript
webpack-url-loader 解决项目中图片打包路径问题
Feb 15 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
使用php来实现网络服务
2009/09/15 PHP
整理的9个实用的PHP库简介和下载
2010/11/09 PHP
php中instanceof 与 is_a()区别分析
2015/03/03 PHP
PHP将session信息存储到数据库的类实例
2015/03/04 PHP
Zend Framework实现Zend_View集成Smarty模板系统的方法
2016/03/05 PHP
学习PHP session的传递方式
2016/06/15 PHP
PHP 对象接口简单实现方法示例
2020/04/13 PHP
表单元素事件 (Form Element Events)
2009/07/17 Javascript
div当滚动到页面顶部的时候固定在顶部实例代码
2013/05/27 Javascript
Three.js学习之正交投影照相机
2016/08/01 Javascript
详解Angular中$cacheFactory缓存的使用
2016/08/19 Javascript
bootstrap fileinput完整实例分享
2016/11/08 Javascript
JavaScript中创建对象的7种模式详解
2017/02/21 Javascript
Bootstrap模态对话框中显示动态内容的方法
2018/08/10 Javascript
vue填坑之webpack run build 静态资源找不到的解决方法
2018/09/03 Javascript
vue项目中,main.js,App.vue,index.html的调用方法
2018/09/20 Javascript
vue实现与安卓、IOS交互的方法
2018/11/02 Javascript
vue.js iview打包上线后字体图标不显示解决办法
2020/01/20 Javascript
vue学习笔记之作用域插槽实例分析
2020/02/01 Javascript
在Django的视图(View)外使用Session的方法
2015/07/23 Python
Python的collections模块中namedtuple结构使用示例
2016/07/07 Python
python利用正则表达式搜索单词示例代码
2017/09/24 Python
python爬虫之urllib,伪装,超时设置,异常处理的方法
2018/12/19 Python
Python基于WordCloud制作词云图
2019/11/29 Python
Python 将代码转换为可执行文件脱离python环境运行(步骤详解)
2021/01/25 Python
CSS3 二级导航菜单的制作的示例
2018/04/02 HTML / CSS
HTML5新增元素如何兼容旧浏览器有哪些方法
2014/05/09 HTML / CSS
澳洲在线厨具商店:Kitchen Style
2018/05/05 全球购物
最便宜促销价格订机票:Airpaz(总部设在印尼,支持中文)
2018/11/13 全球购物
值类型与引用类型有什么不同?请举例说明?并分别列举几种相应的数据类型
2015/10/24 面试题
咖啡店自主创业商业计划书
2014/01/22 职场文书
自立自强的名人事例
2014/02/10 职场文书
见习期个人总结
2015/03/05 职场文书
2016年第二十五次全国助残日活动总结
2016/04/01 职场文书
2019年浪漫婚礼证婚词
2019/06/27 职场文书
Python Pandas解析读写 CSV 文件
2022/04/11 Python