Labroskas Posted July 23, 2014 at 08:45 AM Report Share #563115 Posted July 23, 2014 at 08:45 AM (edited) 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> Edited July 23, 2014 at 08:46 AM by Labroskas Link to comment Share on other sites More sharing options...
MSOlhao Posted July 27, 2014 at 12:55 AM Report Share #563469 Posted July 27, 2014 at 12:55 AM (edited) Viva, Primeiro que tudo dá um id ou uma classe a cada <li> das tabs: <ul> <li class="tb1"><a href="#tabs-1">Clientes</a></li> <li class="tb2"><a href="#tabs-2">Fornecedores</a></li> <li class="tb3"><a href="#tabs-3">Produtos</a></li> </ul> Depois na inicialização do widget tab fazes isto: $( "#tabs" ).tabs({ activate: function( event, ui ) { if (ui.newTab.hasClass('tb1')) { // chama a função desejada para a tab1 } else if (ui.newTab.hasClass('tb2')) { // chama a função desejada para a tab2 } else { // e o mesmo para a 3 } } }); Fica com isto para futura referência, http://api.jqueryui.com/tabs/ Edited July 27, 2014 at 12:56 AM by MSOlhao Link to comment Share on other sites More sharing options...
HappyHippyHippo Posted July 27, 2014 at 11:28 AM Report Share #563488 Posted July 27, 2014 at 11:28 AM Viva, deverias ler melhor o que o criador do tópico pretende. ele consegue determinar quando o elemento é seleccionado (está no javascript dele), o problema é que quer misturar javascrpt com uma acção server-side (que vou supor que seja em PHP pela secção do fórum em que colocou o tópico) fica somente a dica para procurares soluções através de AJAX, e se não souberes o que isso é, vê alguns tutoriais na net pois existem imensos. IRC : sim, é algo que ainda existe >> #p@p Portugol Plus Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now