Pergunta

Estou trabalhando no twitter-bootstrap3. Ao clicar no botão "mybtn", o modal com id="myModal" deve aparecer e ao clicar no botão "mybtn2", o modal com id="myModal2" deve aparecer.Mas quando clico em qualquer um dos dois botões, ambos aparecem. O que devo fazer?

Entrar/Cadastre-se

<button id="mybtn2"  style="display:none;" 
    class="btn btn-primary btn-lg" href="#signup" data-toggle="modal" data-target=".bs-modal-sm">
      Sign In/Up
  </button>

<div class="modal fade bs-modal-sm" id="myModal"  tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-sm" >
//code
</div></div>

<div class="modal fade bs-modal-sm" id="myModal2"  tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-sm" >
//code
</div></div>
Foi útil?

Solução

Adicione o ID do modal que você deseja atingir.Neste momento, seu data-target atributos estão apontando para a classe de bs-modal-sm que se aplica a AMBOS os seus modais.Tentar data-target="#myModal" ou data-target="#myModal2" como apropriado.

Aqui está uma demonstração bootply: link

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top