zl程序教程

您现在的位置是:首页 >  后端

当前栏目

jqueryui对话框实例代码

实例代码 对话框 JQueryUI
2023-06-13 09:14:53 时间

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

复制代码代码如下:

<body>
   <formid="form1"runat="server">

   <divid="dlg">

       <asp:TextBoxID="TextBox1"runat="server"></asp:TextBox>

   </div>

      <asp:ButtonID="Showdlg"runat="server"Text="..."/>

   </form>

   <scripttype="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");returnfalse});

        }

       );

   </script>

</body>


其中值得注意的是appendTo:"form"选项,JqueryUIDialog默认情况向会将表示对话框的<divid="dlg">添加到Body上,这样当表单提交时,服务端就无法获取到对话框中的服务器控件相关的值了。