javascript - 送信後にフォームを非表示

Question

Jquery を使用して送信ボタンを押した後、フォームを非表示にしようとしています。

これまでのところ、Jquery ライブラリをインポートしました。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>  

クラス「form-fields」を使用してフォームを非表示にしようとしています。このクラスはフォーム全体を保持します。

次のように非表示にしようとしています。

 <?php if (isset($_POST['process']) && ($_POST['process'] == 1)): ?>
<script type="text/Javascript">
    $('#form-fields').hide(); 
</script>

これは機能していないようです。どんな助けでも大歓迎です。

Answer 1

$('form-fields').submit(function(){
    var $this = $(this); // so we can use in ajax callback
    $.ajax({
        url: '/',
        data: $(this).serialize(),
        success: function(data){
            if(data == true){
               $this.hide(); //hide form if we got a true to return
            }
        }
    });
    return false; //stop default form submit
});

同じページ...

<?php 
if(isset($_POST['process']) && ($_POST['process'] == 1)):
    // do whatever processing
    return true; //at the end so we can compare in ajax
endif;     
?>

Answer 2

You can add the css property of that element to hidden on click..


$(function(){
 $('form-fields').submit(function(){
     $(this).css("visibility", hidden);
  });
});