Bootstrap модальное открытие на второй клик/модальный внутри мода

Question

У меня есть два модала, один внутри другого. Первый модальный содержит форму и на submit я хочу, чтобы другой модальный с сообщением в нем, чтобы открыть. Я сделал это с помощью Bootstrap. Первая модальные открывается при щелчке по этой кнопке:

<button class="contact-button" data-toggle="modal" data-target="#contact-modal">Contactează-ne</button> 

И это первый модальный:

<div id="contact-modal" class="modal fade" role="dialog"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal">&times;</button> 
     <h4 class="modal-title">Contactaţi-ne</h4> 
     </div> 

     <div class="modal-body"> 

     <form id="contact-form"> 
      <div class="col-md-12"> 
      <h4>Numele Dvs *</h4> 
      <input type="text" name="name" value="" placeholder=""> 
      </div> 
      <div class="col-md-6"> 
      <h4>Email *</h4> 
      <input type="text" name="email" value="" placeholder="johndoe@yahoo.com"> 
      </div> 
      <div class="col-md-6"> 
      <h4>Telefon *</h4> 
      <input type="text" name="tel" value="" placeholder="+40******"> 
      </div> 
      <div class="col-md-12"> 
      <h4>Mesaj *</h4> 
      <textarea></textarea> 
      </div> 
      <div class="col-md-12"><h6>*câmpurile sunt obligatorii</h6></div> 
      <div class="col-md-12 call"> 
      <button>Trimite Mesaj</button> 
      </div> 
     </form> 
     </div> 
    </div> 
    </div> 
</div> 

На представить вторую модальный открывается, и я хочу, чтобы первый один, чтобы закрыть, когда это произойдет. Я достиг этого с помощью этого сценария:

$('form#contact-form').submit(function(e){ 
    e.preventDefault(); 
    $('#call-answer').modal(); 
    $('#contact-modal').hide(); // first modal closes 
}) 

#call-answer является вторым модальный, это также сделано с Bootstrap, я только открыть его вручную. Итак, когда страница загружается, все работает нормально, я нажимаю кнопку, форма контакта открывается в модальном режиме, после чего она закрывается, а второй модат открывается. Теперь проблема в том, что если я снова нажму на кнопку, которая откроет форму контакта, она не откроется, пока я не нажму два раза. Я знаю, что проблема связана с моим сценарием, потому что если я удалить строку

$('#contact-modal').hide();

все работает просто отлично. У кого-нибудь есть лучшая идея о том, как я могу закрыть первый модальный, когда откроется второй? или как я могу это решить? Благодаря

Answer 1

Проблема с этой линии $('#contact-modal').hide();

Не используйте hide при работе с плагинами

Используйте эту линию $('#contact-modal').modal('hide');

Demo

Reference