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 相关文章推荐
js left,right,mid函数
Jun 10 Javascript
JS setCapture 区域外事件捕捉
Mar 18 Javascript
window.print打印指定div实例代码
Dec 13 Javascript
js实现屏幕自适应局部代码分享
Jan 30 Javascript
js实现iGoogleDivDrag模块拖动层拖动特效的方法
Mar 04 Javascript
JavaScript之AOP编程实例
Jul 17 Javascript
AngularJS手动表单验证
Feb 01 Javascript
javascript拖拽效果延伸学习
Apr 04 Javascript
jQuery内容过滤选择器用法示例
Sep 09 Javascript
React中jquery引用的实现方法
Sep 12 jQuery
Angular2实现组件交互的方法分析
Dec 19 Javascript
JavaScript设计模式之职责链模式应用示例
Aug 07 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
PHP和XSS跨站攻击的防范
2007/04/17 PHP
浅析php数据类型转换
2014/01/09 PHP
javascript字符串拼接的效率问题
2010/12/25 Javascript
Jquery实现带动画效果的经典二级导航菜单
2013/03/22 Javascript
JS调用CS里的带参方法实例
2013/08/01 Javascript
利用JS判断用户是否上网(连接网络)
2013/12/23 Javascript
javascript如何使用bind指定接收者
2014/05/04 Javascript
js中各种类型的变量在if条件中是true还是false
2014/07/16 Javascript
浅谈移动端之js touch事件 手势滑动事件
2016/11/07 Javascript
浅谈js中function的参数默认值
2017/02/20 Javascript
纯js代码生成可搜索选择下拉列表的实例
2018/01/11 Javascript
详解Node 定时器
2018/02/26 Javascript
jQuery 同时获取多个标签的指定内容并储存为数组
2018/11/20 jQuery
bootstrap-table formatter 使用vue组件的方法
2019/05/09 Javascript
使用Phantomjs和Node完成网页的截屏快照的方法
2019/07/16 Javascript
VUE 自定义组件模板的方法详解
2019/08/30 Javascript
Vue实现数据请求拦截
2019/10/23 Javascript
Vue两个版本的区别和使用方法(更深层次了解)
2020/02/16 Javascript
jquery实现进度条状态展示
2020/03/26 jQuery
python检测服务器是否正常
2014/02/16 Python
python处理Excel xlrd的简单使用
2017/09/12 Python
[原创]windows下Anaconda的安装与配置正解(Anaconda入门教程)
2018/04/05 Python
Python判断变量名是否合法的方法示例
2019/01/28 Python
Django中如何使用sass的方法步骤
2019/07/09 Python
使用python将多个excel文件合并到同一个文件的方法
2019/07/09 Python
Django Channel实时推送与聊天的示例代码
2020/04/30 Python
python 实现的IP 存活扫描脚本
2020/12/10 Python
兰蔻法国官方网站:Lancôme法国
2020/02/22 全球购物
群众路线剖析材料
2014/02/02 职场文书
远程研修随笔感言
2014/02/10 职场文书
社区两委对照检查材料
2014/08/23 职场文书
民主评议党员个人自我评价
2015/03/03 职场文书
如何起草一份正确的合伙创业协议书?
2019/07/04 职场文书
Python 内置函数速查表一览
2021/06/02 Python
SpringBoot中获取profile的方法详解
2022/04/08 Java/Android
HTML页面中使两个div并排显示的实现
2022/05/15 HTML / CSS