jQuery重置对话框取消和关闭表格发布
问题描述:
我有代码,当验证成功时打开对话框,验证和张贴表单。jQuery重置对话框取消和关闭表格发布
如果用户点击“取消”,对话框应该重置,直到下一次被调用。
如果用户点击“确定”,对话框应该关闭并且表单应该发布,所以如果我点击后退按钮,对话框不会出现在页面上。
代码如下:
<script>
$(function(){//document ready
$("#dialog").dialog({
autoOpen: false,
modal: true
});
$("#confirmLink").click(function(e) {
e.preventDefault();
var targetUrl = $(this).attr("href");
$("#dialog").dialog(
{ minWidth: 500 },{
buttons : {
"Ok": function() {
$('#flagform').submit();
//window.location.href="modalReceipt.asp?documentGUID="+$("#documentGUID").val()+"&fycuserid="+$("#fycuserid").val()+"&reason=" + $("#reason").val()+"&other="+ $("#other").val()
},
"Cancel" : function() {
$(this).dialog("close");
}
},
open: function() {
jQuery.validator.messages.required = "";
$("#flagform").validate({
invalidHandler: function(e, validator) {
var errors = validator.numberOfInvalids();
if (errors) {
var message = errors == 1
? 'You missed 1 field. It has been highlighted below'
: 'You missed ' + errors + ' fields. They have been highlighted below';
$("div.error span").html(message);
$("div.error").show();
} else {
$("div.error").hide();
}
},
// the errorPlacement has to take the table layout into account
messages: {
reason: "*",
explanation: "*"
},
});//validate
},
});
$("#dialog").dialog("open");
});
});
</script>
</head>
<body>
<a class="normal" id="confirmLink" href="">Test</a>
<div id="dialog" title="Flag This Document" style="display:none">
<form id="flagform" action="modalReceipt.asp" method="post">
Please choose a reason for flagging this document and provide an explanation, if necessary.
<p><p><div class="error" style="display:none;color:red"> <span></span>.<br clear="all"/>
</div>
<table class="emptygrid">
<tr>
<td class="header">Reason:</td>
<td class="data">
<select name="reason" id="reason" class="required">
<option value="">-- Choose a Reason --</option>
<option value="plagiarism">Plagiarism</option>
<option value="submissionError">Submission Error</option>
<option value="instructions">Student Didn't Follow Instructions</option>
<option value="blankDocument">Blank Document</option>
<option value="other">Other (please explain)</option>
</select>
</td>
<td class="status"></td>
</tr>
<tr>
<td class="header" style="vertical-align:top">Explanation:</td>
<td class="data"> <textarea name="explanation" rows="10" cols="35"></textarea></td><td class="status"></td>
</tr>
</table>
<input type="hidden" id="fycuserid" name="fycuserid" value="33"/>
<input type="hidden" id="documentGUID" name="documentGUID" value="26219247-EB85-4ABD-8F74-C8448BA06472"/>
</form>
</div>
答
如果用户点击“取消”的 对话框应该重置,直到下一个 时,它被称为。
编辑您的“取消”这样的事情,
"Cancel": function() {
$(this).dialog("close");
$(this).find('form')[0].reset();
}
如果用户点击“OK”的对话框应该关闭和形式要张贴检查,因此,如果我打的后退按钮该对话框不会出现在页面上。
我建议你在服务器端做。提交成功时,请执行cookie或会话变量。加载页面时检查该变量,并为对话框显示或不显示在页面上做些事情。
是否值得设置内容...在页面上过期,以便他们不能回去? – Caveatrob 2010-09-22 22:06:26
如果文档有多个表单会怎么样?我能找到('#formname')。reset(); ? – Caveatrob 2010-09-27 00:10:23
如果它在对话框中,是的,你可以... – Reigel 2010-09-27 00:59:59