Bom dia. Temos algum exemplo de um MODAL que existe várias opções? Como por exemplo: Um modal para cadastro de produtos e dentro dele ter opções de navegação como, Geral, Outros, Específicos.
Obrigado
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Bom dia. Temos algum exemplo de um MODAL que existe várias opções? Como por exemplo: Um modal para cadastro de produtos e dentro dele ter opções de navegação como, Geral, Outros, Específicos.
Obrigado
Matheus. pelo que entendi você quer abrir um modal que dentro contenha varias "tabs" para vc navegar entre geral, outros, etc...
se puder especificar mais posso colocar um exemplo de código.
Exatamente isso amigo. Exemplo na primeira tab informações gerais como código, descri cação, valor. Na segunda tab informações como: peso, dimensões..
Obrigado
Amigo, veja se consegue. exemplo utilizando o framework de css bootstrap por exemplo:
<!-- Chamada do Modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">Abrir Modal</button>
<!--Modal -->
<div id="myModal" 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">×</button>
<h4 class="modal-title">Titulo do modal</h4>
</div>
<div class="modal-body">
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#gerais">Gerais</a></li>
<li><a data-toggle="tab" href="#outros">Outros</a></li>
<li><a data-toggle="tab" href="#especificos">Especificos</a></li>
<ul>
<div class="tab-content">
<div id="gerais" class="tab-pane fade in active">
<h3>Gerais</h3>
<p>conteudo do geral.</p>
</div>
<div id="outros" class="tab-pane fade">
<h3>Outros</h3>
<p>conteudo de outros</p>
</div>
<div id="especificos" class="tab-pane fade">
<h3>Especificos</h3>
<p>conteudo de especificos</p>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
</div>
</div>
</div>
</div>Perfeito, era isso mesmo.. muito obrigado pela ajuda :D
show matheus, fico feliz por ter te ajudado a solucionar o problema!