xtroino 0 Denunciar post Postado Maio 11, 2017 Olá galera! Preciso de criar com PHP e Bootstrap umas Tabs mas cujo conteúdo venha do BD. Queria que numa determinada condição fossem inseridas funções mas não estou a conseguir. Os dados das função aparecem sempre, fora das Tabs e não de acordo com as tabs selecionadas. Alguém pode ajudar? $var = $_GET['p']; $tab_query = "SELECT * FROM tab1 INNER JOIN tab2 WHERE tab2.tab1id=tab1.tab1id AND idtab = $var ORDER BY tab1.tab1id ASC"; $tab_result = mysqli_query($con, $tab_query) or die("Error: ".mysqli_error($con)); $tab_menu = ''; $tab_content = ''; $i = 0; while($row = mysqli_fetch_array($tab_result)) { if($i == 0) { $tab_menu .= ' <li class="active"><a href="#'.$row["tab1id"].'" data-toggle="tab">'.$row["tab1"].'</a></li> '; $tab_content .= ' <div id="'.$row["tab1id"].'" class="tab-pane fade in active"> '; } else { $tab_menu .= ' <li><a href="#'.$row["tab1id"].'" data-toggle="tab">'.$row["tab1"].'</a></li> '; $tab_content .= '<div id="'.$row["tab1id"].'" class="tab-pane fade">'; } $tab3_query = "SELECT * FROM tab2 WHERE tab1id = '".$row["tab1id"]."' "; $tab3_result = mysqli_query($con, $tab3_query); while($sub_row = mysqli_fetch_array($tab3_result)) $cat=$row["tab1id"]; { if ($cat==1){ $tab_content .= '<div class="col-md-12" style="margin-bottom:36px;">'.funcao1().'</div>'; } else if ($cat==2) { $tab_content .= '<div class="col-md-12" style="margin-bottom:36px;">'.funcao2().'</div>'; } else if ($cat==3) { $tab_content .='<div class="col-md-12" style="margin-bottom:36px;">'.funcao3().'</div>'; } } $tab_content .= '<div style="clear:both"></div></div>'; $i++; } Compartilhar este post Link para o post Compartilhar em outros sites
gabrieldarezzo 255 Denunciar post Postado Maio 11, 2017 Vamos por partes. Você já domina o conceito de Tabs do Bootstrap? http://getbootstrap.com/components/#nav-tabs Basicamente você precisa de um elemento cujo a 'data-toggle' seja tab: data-toggle="tab" E o 'href' desse cara é quem você aponta (usando um # antes) Exemplo completo: <ul class="nav nav-tabs"> <li class="nav active"><a href="#A" data-toggle="tab">A</a></li> <li class="nav"><a href="#B" data-toggle="tab">B</a></li> <li class="nav"><a href="#C" data-toggle="tab">C</a></li> </ul> Agora só criar os 'tab-content' que possuem um id: <!-- Tab panes --> <div class="tab-content"> <div class="tab-pane fade in active" id="A">Content inside tab A</div> <div class="tab-pane fade" id="B">Content inside tab B</div> <div class="tab-pane fade" id="C">Content inside tab C</div> </div> Obviamente não podemos esquecer de de importar o CSS (de preferencia no HEAD), muito menos O JS (que faz tudo funcionar): <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title></title> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> <!-- Optional theme --> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css"> </head> <body> ... <script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script> </body> </html> Exemplo completo: https://jsfiddle.net/dajyc658/ Após criar isso 'estaticamente esquecendo do PHP' e funcionar você pensa em PHP. Obviamente pode ser um erro de JavaScript tambem. nesse caso você precisa abrir o Console do seu browser: Mozilla: Ctrl + Shift + K Google Chrome: Ctrl + Shif + J Veja se tem algum erro. .... Após isso você tenta gerar dinamicamente os campos que gera estaticamente. Compartilhar este post Link para o post Compartilhar em outros sites
xtroino 0 Denunciar post Postado Maio 11, 2017 gabrieldarezzo agradeço a resposta. Não coloquei o código todo. Acontece que em html tudo funciona bem. Aqui o código todo: $var = $_GET['p']; $tab_query = "SELECT * FROM tab1 INNER JOIN tab2 WHERE tab2.tab1id=tab1.tab1id AND idtab = $var ORDER BY tab1.tab1id ASC"; $tab_result = mysqli_query($con, $tab_query) or die("Error: ".mysqli_error($con)); $tab_menu = ''; $tab_content = ''; $i = 0; while($row = mysqli_fetch_array($tab_result)) { if($i == 0) { $tab_menu .= ' <li class="active"><a href="#'.$row["tab1id"].'" data-toggle="tab">'.$row["tab1"].'</a></li> '; $tab_content .= ' <div id="'.$row["tab1id"].'" class="tab-pane fade in active"> '; } else { $tab_menu .= ' <li><a href="#'.$row["tab1id"].'" data-toggle="tab">'.$row["tab1"].'</a></li> '; $tab_content .= '<div id="'.$row["tab1id"].'" class="tab-pane fade">'; } $tab3_query = "SELECT * FROM tab2 WHERE tab1id = '".$row["tab1id"]."' "; $tab3_result = mysqli_query($con, $tab3_query); while($sub_row = mysqli_fetch_array($tab3_result)) $cat=$row["tab1id"]; { if ($cat==1){ $tab_content .= '<div class="col-md-12" style="margin-bottom:36px;">teste 1</div>'; } else if ($cat==2) { $tab_content .= '<div class="col-md-12" style="margin-bottom:36px;">teste 2</div>'; } else if ($cat==3) { $tab_content .='<div class="col-md-12" style="margin-bottom:36px;">teste 3</div>'; } } $tab_content .= '<div style="clear:both"></div></div>'; $i++; } ... <!-- Bootstrap Core CSS --> <link href="css/bootstrap.min.css" rel="stylesheet"> <!-- Custom CSS --> <link href="css/modern-business.css" rel="stylesheet"> <!-- Custom Fonts --> <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> ... <div class="row"> <div class="col-lg-12"> <br /> <ul class="nav nav-tabs"> <?php echo $tab_menu; ?> </ul> <div class="tab-content"> <br /> <?php echo $tab_content; ?> </div> </div> </div> Eu apenas quero substituir onde está teste 1 por uma função php, teste 2 por outra funcao, etc. Não sei se é possível Obrigado pela ajuda. Compartilhar este post Link para o post Compartilhar em outros sites
xtroino 0 Denunciar post Postado Maio 12, 2017 Alguém tem uma sugestão? Obrigado. Compartilhar este post Link para o post Compartilhar em outros sites