投稿時にRSFormフォームを非表示

Question

RSFormで送信したときに「読み込み中...」というメッセージが表示されるAJAXコードがあります。

ユーザーが送信ボタンをクリックしたときにフォームを非表示にしたいとします。この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> 

私は、事前送信コールバックに何かを追加する必要があると思いますが、どうすればよいか分かりません。私は、フォームを隠し、彼らに「ありがとう」のメッセージを表示したい誰かが送信ボタン

Answer 1

をクリックしたときにあなたが.ajaxStart()メソッドを使用することができます

$(document).ajaxStart(function(){ 
    $('#userForm').hide(); 
    $('#userForm').find('.my-message').html("Thank You!!!"); 
}); 

あるいはこれらの機能の2行を追加します

を

// 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. 
} 

Answer 2

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属性に有効な値ではないかもしれません。 有効な値の詳細については、LINKを確認してください。