JQueryを使用して、特定のタブを開いたままタブ付きモーダルを自動的に開く方法

Question

タブ付きブートストラップモーダルに埋め込まれたフォームからlaravel 5.2のコントローラメソッドにデータを送信します。

それぞれのタブのフォームが異なり、各タブのフォーム上部に検証エラーを表示する必要があります。すべてのタブの各フォームの上部に、検証エラーの表示コードを追加しました。フォームにエラーがある場合、エラーはフォームの上部に表示されますが、私はそれを見ることができません。今、私はいくつかの検索を行なったし、自動的に私の見解では、コードのこの部分を使用して、フォーム記入に誤りがあった場合には、モーダル再オープンすることができました：

@if ($errors->all()) 
    $('#modal').modal('show'); 
@endif 

をしかし、これは唯一のデフォルトへのモーダルを開きますタブ。私は、ユーザーが入力したフォームでタブにモーダルを開くことができるようにしたいと考えています。可能であれば、JQueryでこれを行いたいと思います。出来ますか？

私のモーダルはこのようなものになります。コードの上に見られるように

<!-- Button to trigger modal --> 
<a href="#TaskListDialog" role="button" class="btn btn-default" data-toggle="modal">Launch modal</a> 

<div id="TaskListDialog" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="windowTitleLabel"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <h3>Modal Heading</h3> 
      </div> 

      <div class="modal-body"> 
       <div class="tabbable"> 
        <ul class="nav nav-tabs"> 
         <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li> 
         <li><a href="#tab2" data-toggle="tab">Section 2</a></li> 
        </ul> 

        <div class="tab-content"> 
         <div class="tab-pane active" id="tab1"> 
          //space for another form here 
         </div> 
         <div class="tab-pane" id="tab2"> 
         //display validation error here 
          <form action="{{ route('someroute/') }}"> 
           <input type="text" name="name" class="form-control"> <br> 
           <input type="email" name="email" class="form-control"> <br> 
          </form> 

         </div> 
        </div> 
       </div> 
      </div> 

     </div> 
    </div> 
</div> 

を、タブがsection 1とsection 2です。

もう一度私の質問は、section 1の代わりにsection 2をアクティブにしてモーダルを開くにはどうすればいいですか？それとも、全体的なことをするより良い方法がありますか？

ご協力いただきますようお願い申し上げます。ありがとう。

あなただけ id_of_the_nav

tab2とデモ置き換えるSection 2を有効にしたい場合は、あなたのケースで

$('.nav-tabs a[href="#id_of_the_nav"]').tab('show'); 

ので、以下のコードをしたいnavの任意の部分を活性化させることができ

Answer 1

：https://jsfiddle.net/Prakash_Thete/s6jjmdc4/1/

Answer 2

を

さて、私は方法を見つけた。 jqueryでクリックtriggerを使用しました。

<script> 
    $('#tab_id').trigger('click'); 
</script> 

これは実際にタブをクリックするのと同じです。