jquery ui对话框实例代码


Posted in Javascript onMay 10, 2013

目前JqueryUI提供的对话框支持使用相对比较的方便,示例代码如下所示:

<body>
    <form id="form1" runat="server">
    <div id="dlg">
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    </div>
       <asp:Button ID="Showdlg" runat="server" Text="..." />
    </form>
    <script type="text/javascript" language="javascript">
      $(function () {
             $("#dlg").dialog({
                autoOpen: false,
                closed: true,
                width: 450,
                modal: true,
                appendTo: "form",
                buttons: {
                    "OK": function () {
                        $("form").submit();
                    },
                    "Cancle": function () {
                        $(this).dialog("close");
                    }
                },
                close: function () {
                }
            });
            $("#<%=Showdlg.ClientID%>").button().click(function() { $("#dlg").dialog("open"); return false });
         }
        ); 
    </script>
</body>

其中值得注意的是appendTo: "form"选项, JqueryUI Dialog默认情况向会将表示对话框的<div id="dlg">添加到Body上,这样当表单提交时,服务端就无法获取到对话框中的服务器控件相关的值了。
Javascript 相关文章推荐
JQuery 操作Javascript对象和数组的工具函数小结
Jan 22 Javascript
JavaScript中函数声明优先于变量声明的实例分析
Mar 01 Javascript
jQuery中将函数赋值给变量的调用方法
Mar 23 Javascript
JS和jquery获取各种屏幕的宽度和高度的代码
Aug 02 Javascript
jquery可定制的在线UEditor编辑器
Nov 17 Javascript
如何实现星星评价(jquery.raty.js插件)
Dec 21 Javascript
jquery仿京东侧边栏导航效果
Mar 02 Javascript
webpack实用小功能介绍
Jan 02 Javascript
jquery radio 动态控制选中失效问题的解决方法
Feb 28 jQuery
微信小程序自定义导航栏实例代码
Apr 05 Javascript
简单说说如何使用vue-router插件的方法
Apr 08 Javascript
vue elementUI 表单校验功能之数组多层嵌套
Jun 04 Javascript
javascrip关于继承的小例子
May 10 #Javascript
jQuery ReferenceError: $ is not defined 错误的处理办法
May 10 #Javascript
解析瀑布流布局:JS+绝对定位的实现
May 08 #Javascript
JavaScript 对任意元素,自定义右键菜单的实现方法
May 08 #Javascript
深入document.write()与HTML4.01的非成对标签的详解
May 08 #Javascript
使用JavaScript 实现各种跨域的方法
May 08 #Javascript
jQuery根据纬度经度查看地图处理程序
May 08 #Javascript
You might like
DC《小丑》11项提名领跑奥斯卡 Netflix成第92届奥斯卡提名最大赢家
2020/04/09 欧美动漫
thinkPHP中多维数组的遍历方法
2016/01/09 PHP
Laravel 实现Eloquent模型分组查询并返回每个分组的数量 groupBy()
2019/10/23 PHP
脚本收藏iframe
2006/07/21 Javascript
基于prototype的validation.js发布2.3.4新版本,让你彻底脱离表单验证的烦恼
2006/12/06 Javascript
找到了一篇jQuery与Prototype并存的冲突的解决方法
2007/08/29 Javascript
验证用户是否修改过页面的数据的实现方法
2008/09/26 Javascript
JavaScript 函数调用规则
2009/09/14 Javascript
日历查询的算法 如何计算某一天是星期几
2012/12/12 Javascript
使用JavaScript 编写简单计算器
2014/11/24 Javascript
js编写的treeview使用方法
2016/11/11 Javascript
jQuery实现按比例缩放图片的方法
2017/04/29 jQuery
解决在vue+webpack开发中出现两个或多个菜单公用一个组件问题
2017/11/28 Javascript
在angularJs中进行数据遍历的2种方法
2018/10/08 Javascript
微信小程序实现form表单本地储存数据
2019/06/27 Javascript
vue使用代理解决请求跨域问题详解
2019/07/24 Javascript
JS函数参数的传递与同名参数实例分析
2020/03/16 Javascript
小程序自定义导航栏兼容适配所有机型(附完整案例)
2020/04/26 Javascript
基于vue与element实现创建试卷相关功能(实例代码)
2020/12/07 Vue.js
[02:02]DOTA2英雄基础教程 斯拉达
2013/12/11 DOTA
[03:06]V社市场总监Dota2项目负责人Erik专访:希望更多中国玩家加入DOTA2
2014/07/11 DOTA
[51:17]VGJ.T vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
python实现的二叉树算法和kmp算法实例
2014/04/25 Python
python实现zabbix发送短信脚本
2018/09/17 Python
解决pycharm py文件运行后停止按钮变成了灰色的问题
2018/11/29 Python
centos7之Python3.74安装教程
2019/08/15 Python
Win10下python 2.7与python 3.7双环境安装教程图解
2019/10/12 Python
请说出你所知道的线程同步的方法
2013/04/19 面试题
经理职责范文
2013/11/08 职场文书
延安红色之旅心得体会
2014/10/07 职场文书
大学生毕业评语
2014/12/31 职场文书
学术会议领导致辞
2015/07/29 职场文书
校长新学期致辞
2015/07/30 职场文书
JDBC连接的六步实例代码(与mysql连接)
2021/05/12 MySQL
Vue CLI中模式与环境变量的深入详解
2021/05/30 Vue.js
Win11 Build 22000.51版本文件资源管理器“命令栏”和上下文菜单有什么新变化?
2021/11/21 数码科技