动态加载的Jquery对话框在单击按钮时不会关闭 [英] dynamically loaded Jquery dialog does not close on click of a button
问题描述
大家好，
我的呼叫页面如下：
Hi all,
I have my calling page as below :
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication2.WebForm2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<%--<link rel="Stylesheet" href="Content/DialogBox.css" />--%>
<style type="text/css">
.ui-dialog {
position: fixed;
padding: .2em;
width: 300px;
overflow: hidden;
border: solid;
}
.ui-widget-overlay {
left: 0;
top: 0;
width: 100%;
height: 100%;
position: absolute;
background: #aaaaaa /*{bgColorOverlay}*/ url(images/ui-bg_flat_0_aaaaaa_40x100.png) /*{bgImgUrlOverlay}*/ 50% /*{bgOverlayXPos}*/ 50% /*{bgOverlayYPos}*/ repeat-x /*{bgOverlayRepeat}*/;
opacity: .3;
filter: Alpha(Opacity=30) /*{opacityOverlay}*/;
}
</style>
<script type="text/javascript" src="Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript" src="Scripts/jquery-ui-1.8.17.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('<div id="dialogDiv"></div>').load('WebForm1.aspx').appendTo('body');
$('#dialogDiv').dialog({
resizable: false,
height: 140,
modal: true,
autoOpen: true,
draggable: false,
title: "This new idiot dialog",
create: function () {
$(".ui-dialog-titlebar-close").hide();
},
buttons: {
"ok": function () {
$(this).dialog("close");
}
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
</form>
</body>
</html>
我的动态加载页面（本例中为webForm4.aspx）如下：
And my dynamically loaded page(webForm4.aspx in this case) as below :
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="WebApplication2.WebForm4" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script language="javascript" type="text/javascript">
function bindEvent() {
var text = $('#inittext').val();
if (text.length < 3) {
alert("Enter atleast 3 characters");
}
else {
$('#dialogDiv').dialog('close');
}
}
</script>
</head>
<body>
<div id="content">
<table width="100%">
<tr>
<td align="center">Acknowledgement (Enter Initials):
<input id="inittext" type="text" value="" style="width: 40px;" maxlength="3" />
<input id="btnContinue" type="button" value="done" style="width: 40px;" onclick="bindEvent()" />
</td>
</tr>
</table>
</div>
</body>
</html>
我要关闭对话框通过单击上面代码中生成的完成按钮但问题是完成按钮单击事件永远不会被触发。任何人都可以帮助我吗？
webform4.aspx中还有一个html文本框。如何在调用页面中获取该文本框的值？
P.S. - >我可以更改webForm4.aspx的内容，因此必须通过webForm4.aspx上的按钮关闭对话框
I want to close the dialog box by clicking 'done' button which is generated in above code But the problem is the 'done' button click event is never fired. Can anyone please help me?
Also there is an html text box in webform4.aspx. How do I get the value of that text box in calling page?
P.S. -> I can change contents of webForm4.aspx hence it is necessary that dialog be closed by button on webForm4.aspx
推荐答案
（文档）。ready（ function （）{
(document).ready(function () {
（' < div id =dialogDiv>< / div>'）。load（' WebForm1.aspx'）。appendTo（' body'）;
('<div id="dialogDiv"></div>').load('WebForm1.aspx').appendTo('body');
（' ＃dialogDiv'）。dialog（{
resizable： false ，
height： 140 ，
模态： true ，
autoOpen： true ，
draggable ： false ，
title： 这个新的白痴对话，
创建：功能（）{
('#dialogDiv').dialog({ resizable: false, height: 140, modal: true, autoOpen: true, draggable: false, title: "This new idiot dialog", create: function () {
这篇关于动态加载的Jquery对话框在单击按钮时不会关闭的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
