zoukankan      html  css  js  c++  java
  • JqueryUI对话框实现示例

    JqueryUI对话框实现示例

    在网页设计中,不论是为了减少于由于页面跳转而带来的不友好用户体验,还是为了维持桌面应用程序的使用习惯,对话框的设计都是不可或缺的。

    目前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,

                     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上,这样当表单提交时,服务端就无法获取到对话框中的服务器控件相关的值了。

     

    cuiweican
  • 相关阅读:
    [LeetCode] Range Sum Query
    [LeetCode] Longest Increasing Subsequence
    [LeetCode] Bulls and Cows
    [LeetCode] Serialize and Deserialize Binary Tree
    [LeetCode] Find Median from Data Stream
    [LeetCode] Convert Sorted List to Binary Search Tree
    [LeetCode] Nim Game
    [LeetCode] Word Pattern
    安装配置说明与注意
    java.lang.OutOfMemoryError: PermGen space及其解决方法
  • 原文地址:https://www.cnblogs.com/javawebsoa/p/3069773.html
Copyright © 2011-2022 走看看