Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Labroskas

Tabs com evento click

Recommended Posts

Boas, tenho este código, e tou com alguma dificuldade em entender bem como vou fazer, Eu quando entro na página tenho três Tab's onde são executados X comandos, mas só queria que esse código fosse executado ao fazer o click no Tab correspondente, espero ter conseguido explicar bem a minha ideia/problema.

Cumps.

 
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Tabs - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script language="javascript" type="text/javascript">
$(document).ready(
function(){
$("#tabs").tabs();
$("a[href=#tabs-1]").click(function()
{
alert("Tab 1 Selected");
});
$("a[href=#tabs-2]").click(function()
{
alert("Tab 2 Selected");
});
$("a[href=#tabs-3]").click(function()
{
alert("Tab 3 Selected");
});

}
);
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><a href="#tabs-1">Clientes</a></li>
<li><a href="#tabs-2">Fornecedores</a></li>
<li><a href="#tabs-3">Produtos</a></li>
</ul>
<div id="tabs-1">
<!-- Aqui quero que execute um SELECT e Um UPDATE, Mas apenas quando fizer o Click no Tab-->
</div>
<div id="tabs-2">
<!-- Aqui quero que execute um SELECT e Um UPDATE, Mas apenas quando fizer o Click no Tab-->
</div>
<div id="tabs-3">
<!-- Aqui quero que execute um INSERT, Mas apenas quando fizer o Click no Tab-->
</div>
</div>
</body>
</html>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ai vc vai ter q executar o select e o update com ajax, dentro do click da tab.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Como você mesmo fez:


$(document).ready(
function(){
$("#tabs").tabs();
$("a[href=#tabs-1]").click(function()
{
$.post("/tab1.php",id:id,function(resposta){
$("
#tabs-1]").html(resposta);
});

});
$("a[href=#tabs-2]").click(function()
{
alert("Tab 2 Selected");
});
$("a[href=#tabs-3]").click(function()
{
alert("Tab 3 Selected");
});

}
);

 

Faça para buscar os dados via GET ou POST e adicionar o conteúdo na div.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.