提交时隐藏RSForm表单
Hide the RSForm form when submitted
我有这个AJAX代码,当以RSForm提交时,它成功地显示了"loading."消息。
我想在用户单击提交按钮时隐藏表单。我应该如何在这个javascript中进行编辑?
<script>
jQuery(function($){
$(document).ready(function() {
var options = {
beforeSubmit: showRequest,
success: showResponseAll
};
// bind to the form's submit event
$('#userForm').submit(function() {
$(this).ajaxSubmit(options);
return false;
});
});
// pre-submit callback
function showRequest(formData, jqForm, options) {
$('.my-message').html("Loading....");
return true;
}
// post-submit callback
function showResponseAll(responseText, statusText, xhr, $form) {
var $response = $(responseText);
var comon = $response;
var dane = comon.find('.message-load')
$('.my-message').html(dane);
}
});
</script>
<form method="post" id="userForm" action="URL"><div class="my-message"></div>
<div class="message-load"><div id="rsform_error_3" style="display: none;"><p class="formRed">Please complete all required fields!</p></div></div>
<fieldset class="form-horizontal formContainer" id="rsform_3_page_0">
<div class="form-group rsform-block rsform-block-email">
<div class="col-xs-12 formControls">
<input type="text" value="" size="20" placeholder="you@email.com" name="form[Email]" id="Email" class="rsform-input-box form-control rsform-input-box">
<span class="formValidation"><span id="component27" class="formNoError">Please let us know your email address.</span></span>
</div>
<div class="col-xs-12">
<button type="submit" name="form[Join Newsletter]" id="Join Newsletter" class="rsform-submit-button btn btn-primary">Join Newsletter</button>
</div>
</div>
</fieldset>
<input type="hidden" name="form[formId]" value="3">
</form>
我认为我们必须添加一些东西来预提交回调,但我不知道如何添加。当有人点击提交按钮
不知道什么时候说RSForm。假设您指的是相同的userForm
$('#userForm').submit(function(event) {
//since making ajax call you have to prevent the default behavior that is submit
event.preventDefault();
$('#userForm').hide();
$(this).ajaxSubmit(options);
return false;
});
});
注意:此id="Join Newsletter"
可能不是id
属性的有效值。您可以查看此链接以了解有关有效值的更多信息。
您可以使用.ajaxStart()
方法:
$(document).ajaxStart(function(){
$('#userForm').hide();
$('#userForm').find('.my-message').html("Thank You!!!");
});
或者在这些函数中添加两行:
// pre-submit callback
function showRequest(formData, jqForm, options) {
$('.my-message').html("Loading....");
$('#userForm').hide(); // <------------hide it here
return true;
}
// post-submit callback
function showResponseAll(responseText, statusText, xhr, $form) {
var $response = $(responseText);
var comon = $response;
var dane = comon.find('.message-load')
$('.my-message').html(dane); // <----i suppose this is Thank you message.
}
相关文章:
- 可以't让我的if语句处理js中的html表单输入
- 如何使用WCF服务和javascript表单post上传.doc文件
- Javascript生成的表单未提交
- 如何使用javascript或html下载PDF格式的填写表单
- HTML表单提交时未执行外部函数
- 如何将输入(type=text)从html表单传递到javascript函数
- 通过单击表单中的按钮,在代码生成中使用javascript生成字母数字代码
- Ajax发布表单序列化,发布引号'
- 多级HTML表单
- 后焦点更改为IE 11中的地址栏,而不是转移到表单中的下一个控件
- 在验证和发送邮件后更改联系人表单的 html
- jQuery表单添加不适用于下拉列表
- Rails/JSON:如何将JSON用于jquery UI自动完成表单
- 如何从pdftron webviewer获取表单数据
- JS验证ajax返回的html中的表单数据
- Javascript更新孙窗口中的表单元素
- 解析javascript表单验证器
- 阻止表单元素提交
- JS表单提交"无法使用Chrome数据保护程序加载此页面.尝试重新加载页面.调试信息:POST CISmtuK
- 提交时隐藏RSForm表单