Почему веб-страница с двумя модальными моделями не работает?

Question

На моей странице у меня есть два модала, когда при открытии первый модал сделал фриз. У меня есть одна кнопка для другого модального

Почему не работают некоторые ограничения из bootstrap?

кода --------------

Модальный

<button class="btn btn-primary" type="button" id="ForPaymentBtn" data-toggle="modal" data-target="modalAdd">A pagar <span class="fa fa-list-alt"></span></button>

<div id="modalAdd" class="modal" role="dialog">
</div>

Модальный 2

  <button id="Submit" class="btn btn btn-success text-center" type="button" data-toggle="modal"  data-target="erromodal"><i class="fa fa-save"></i> Gravar</button>
<div class="modal fade" id="erromodal" role="dialog">

Answer 1

Каждый модал должен иметь другой идентификатор и каждая ссылка должна быть нацелена на другой модальный идентификатор. Так должно быть что-то вроде этого:

<a href="#myModal" data-toggle="modal">
...
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
...
<a href="#myModal2" data-toggle="modal">
...
<div id="myModal2" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>
...

Таким образом, это будет работать. Если вы щелкнете по первой ссылке, на ней должен появиться первый модал, а если вы щелкнете по второй, появится второй модал.