2016-04-25 6 views
1

私のウェブページでブートストラップコラプスコントロールを使用しています。リンクをクリックするたびに、それは開いたり閉じたりしていました。私はAJAXを使用してPHPページにデータを送信し、成功すると結果を出力します。 AJAXコールdata-toggleが終了した後。以下の私のコードを見てください。AJAX成功後のブートストラップコラプスの終了方法

<a data-toggle="collapse" href="#review" class="open-code btn btn-default">Write a Review</a> 
<div id="review" class="collapse code"> 
    <form id="review"> 
     my code... 
    </from> 
</div> 
$(function() { 
    $(document).on('submit', '#review_post', function(e) { 
     //var $this = $(this); 
     var message = $(this).find("#message").val(); 
     var rating = $(this).find("#input-2c").val(); 
     var vendor_id = $(this).find("#vendor_id").val(); 
     var infostring = 'message=' + message + '&rating=' + rating + '&vendor_id=' + vendor_id; 

     if(message=='') { 
      alert('Please add your Message'); 
     } else { 
      $.ajax({ 
       type: "POST", 
       url: "/review_vendor.php", 
       data: infostring, 
       success: function(data){ 
        //alert(data); 
        $('#review_post').each(function() { 
         this.reset(); 
        }); 
        // here I want to use the code to close data-toggle 

        $("#flash").append(data); 
       } 
      }); 
     } 
     e.preventDefault(); 
    }); 
}); 

私はこのコードを試してみましたが、それは働いていない:

$(this).find('.collapse').trigger('click'); 

答えて

2

あなたが引数として'hide'を提供し、再びa要素にcollapse()メソッドを呼び出す必要があります。これを試してみてください:

$(this).find('.collapse').prev('a').collapse('hide'); 

Collapse documentation

はまた、あなたはそれがベストプラクティスに従う作るためにあなたのコードにいくつかの小さな調整を行うことに注意してください。ここに完全な例があります:

$(document).on('submit', '#review_post', function(e) { 
    e.preventDefault(); 
    var $this = $(this); 
    var message = $this.find("#message").val(); 
    var rating = $this.find("#input-2c").val(); 
    var vendor_id = $this.find("#vendor_id").val(); 

    if (message == '') { 
     alert('Please add your Message'); 
    } else { 
     $.ajax({ 
      type: "POST", 
      url: "/review_vendor.php", 
      data: { 
       message: message, 
       rating: rating, 
       vendor_id: vendor_id      
      }, 
      success: function(data) { 
       $('#review_post').each(function() { 
        this.reset(); 
       }); 
       $this.find('.collapse').prev('a').collapse('hide'); 
       $("#flash").append(data); 
      } 
     }); 
    } 
}); 
+0

私は考えています.collapseは正しいクラスではありません。私のHTMLを見てください。 –

+0

ああ、そうだよ。あなたは 'a'要素でそれを呼び出す必要があります。私の更新を参照してください –

+0

私のコードを修正していただきありがとうございますが、まだ動作していません –

関連する問題