我正在使用一个对话框在我的页面上显示并提交一个查询表单。当我尝试一次又一次地 时,我遇到了问题。第一次一切正常并且形式正确s提交成功。但是如果我单击GO按钮(下面添加了html)。我收到此行文档的错误。 的编辑:
<div class="hidden" id="dialog">
<form action="index.php" class="testForm" id="testForm">
<div class="name" id="name">
<div class="displayName" id="dispName">Name</div>
<div class="textName" id="viewName"><input type="text" class="fname" id="fullName" /></div>
<div class="hide" id="nameErr"></div>
</div>
<div class="address" id="addressDetails">
<div class="displayAddress" id="dispAddress">Address</div>
<div class="textAddress" id=""><input type="text" class="taddress" id="fullAddress" /></div>
<div class="hide" id="addressErr"></div>
</div>
<div class="submitForm" ><input type="button" class="submitDetails" id="submitInfo" name="Submit" value="Submit" onClick="validateAndSubmitForm()"/>
<a name="Close" onclick="$('#dialog').dialog('close');">Close</a>
</div>
</form>
</div>
的Javascript \ jquery的
function submitEnquiryForProperty()
{
document.forms.testForm.reset();
$("#dialog").dialog({
modal:true,
resizable:false,
autoOpen:false,
width:260,
});
openDialog();
}
function openDialog(){
$("#dialog").dialog("open");
}
function closeDialog(){
$("#dialog").dialog("close");
}
表单提交上的回调函数
$.ajax({
type:'POST',
url:"processForm.php",
data:"name="+name+"&address="+address,
dataType:"html",
success:function(msg){
if(msg=="success"){
$("#dialog", window.parent.document).html("<div class='pad5'><div class='flt' style='padding-left:3px; width:235px;'><div class='thanx_msg'>Thank you for submitting the details. <br /><div class='spacer5'> </div><span class='gre'>Our Sales team shall revert to your query soon.</span></div></div><div class='spacer5'> </div><div style='padding-left:3px;' class='text'><strong>You can also:</strong></div><div style='margin-left:20px; line-height:20px;'>• Apply for a <a href='homeloan.php'>Home Loan</a><br />• Visit <a href='http://www.proptiger.com'>proptiger.com</a> for more properties<br />• See our <a href='http://www.proptiger.com/blog'>Blog</a> for latest updates</div></div><br/><div class='msg' style='color:red;'>Click to close the box</div>");
$(function(){
$('#dialog').click(function() {
closeDialog();
});
});
}
else
{
alert("Operation cannot be completed,please try again");
}
}
但我面临同样的问题。.reset()
行的错误。
谢谢你的时间。
答案 0 :(得分:2)
如果您想要一个可重复使用的对话框,请按以下步骤操作:
在初始HTML中包含对话框元素(几乎肯定是<div>
)。使用CSS类使其不会立即可见,例如:
HTML:
<div id="dialog" class="hidden">...</div>
CSS:
.hidden { display: none }
在页面加载后立即无条件地从Javascript调用$("#dialog").dialog(options)
。请务必在选项中设置autoOpen: false
。
每当您想要显示对话框时,请使用$("#dialog").dialog("open")
。
每当您想要隐藏对话框时,请使用$("#dialog").dialog("close")
。
根据需要重复步骤3和4.
答案 1 :(得分:0)
.dialog( "destroy" )
完全删除对话框功能。这将使元素返回到pre-init状态。
.dialog( "close" )
关闭对话框。