Belirli bir sekme etkin olan bir Önyükleme modalı nasıl açılır

Question

Hangi bağlantının tıklandığına bağlı olarak, önyükleme dizisi açıkken sekmeyi tutturmaya çalışıyorum. Ne denedim önemli değil, sadece ilk sekmede açılacak. İki bağlantılar şunlardır:

<a href="#tab-mileage" data-toggle="modal" data-target="#buyers-report-modal" >Mileage</a> 
<a href="#tab-wrong-vehicle" data-toggle="modal" data-target="#buyers-report-modal">Wrong vehicle?</a> 

ve modal için biçimlendirme buradadır: etseydim

<div class="modal" id="buyers-report-modal" tabindex="-1" role="dialog" aria-hidden="true"> 
    <div class="modal-dialog modal-lg modal-offset-top"> 
    <div class="modal-content"> 
    <div class="modal-body"> 
    <div class="sd-tabs sd-tab-interaction"> 
     <div class="row"> 
     <ul class="nav nav-tabs col-md-3 custom-bullet"> 

      <li class="active"><a data-toggle="tab" href="#tab-wrong-vehicle"> Wrong Vehicle?</a></li> 
      <li><a data-toggle="tab" href="#tab-mileage"> Mileage</a></li> 

     </ul> 
     <div class="tab-content col-md-9"> 
      <form id="tab-wrong-vehicle" class="tab-pane active" action="" method="post"> <!-- Wrong Vehicle? --> 

      <h3 class="tab-title">Tab 1</h3> 

      </form> <!-- Wrong Vehicle? --> 



      <form id="tab-mileage" class="tab-pane"> <!-- Mileage --> 

      <h2 class="tab-title-resp hidden-md hidden-lg"> Mileage</h2> 
      <h3 class="tab-title">Tab 2</h3> 

      </form> <!-- Mileage --> 

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

Ben, örneğin, tıklandığında linke açılmaya modal gerek ikinci bağlantıya tıkladığınızda, modaldaki ikinci sekmeyi açar. Herhangi bir yardım büyük bir memnuniyetle karşılanacaktır, bunun için hiçbir yerde bir çözüm bulamadım.

Orijinal ID'leri kodda bıraktım ve bunları değiştirirken hata yaptım.

Answer 1

Modelleri değiştiren <a> öğeleri. Ayrıca, tıklatmayla tetikleyen ve href'un tıklatılan öğenin tab("show") değerini kullanıyorum.öğesinin öğesinin içinde href ile eşleşen <li> öğesinin içinde ek bir işlev ekledim.

Demo Fiddle

Answer 2

Sekmenin bağlantı noktasını hedeflemeniz ve $.tab('show') işlevini çalıştırmanız gerekir.

http://getbootstrap.com/javascript/#tabs

sekme çapa sekmesi için selektör geçirmek için veri-geçiş = sekmesi ve href = biz linkinden a href kullanabilirsiniz id niteliklerini olduğunu biliyorum beri.

$('a[data-toggle=modal][data-target]').click(function() { 
    var target = $(this).attr('href'); 
    $('a[data-toggle=tab][href=' + target + ']').tab('show'); 
}) 

DEMO: shown.bs.modal olayın http://jsfiddle.net/SeanWessell/2ct9zuu9/

Answer 3

alın yarar. Buna göre olay <a> tıklayan href hakkında bilgi tutar ve sonra sekmeyi değiştirebilirsiniz:

$("#buyers-report-modal").on('shown.bs.modal', function(e) { 
    var tab = e.relatedTarget.hash; 
    $('.nav-tabs a[href="'+tab+'"]').tab('show') 
}) 

kodunuzu çalışma - Ben bir sınıf .modal-toggle ekledik>http://jsfiddle.net/pvo1sny8/