Ir para conteúdo

Arquivado

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

Rodrigo Biaggio

Adicionando Aba e conteúdo dinamicamente

Recommended Posts

Pessoal,

 

Preciso de ajuda com Tabs Dinâmicas.

 

Esse é o meu código:

<!-- Chamando a conexão com o banco de dados -->
<?php require_once('Connections/conecta.php')?>
<?php
// A sessão precisa ser iniciada em cada página diferente
if (!isset($_SESSION)) session_start();
// Verifica se não há a variável da sessão que identifica o usuário
if (!isset($_SESSION['UsuarioID'])) {
  // Destrói a sessão por segurança
  session_destroy();
  // Redireciona o visitante de volta pro login
  header("Location: index.php"); exit;
}
?>
<?php
    //Verifica se existe conexão com bd, caso não tenta criar uma nova
	//Porta, usuário, senha
    $conexao = mysql_connect("localhost","root","123pig")
	//Caso não consiga conectar mostra a mensagem de erro mostrada na conexão
    or die("Erro na conexão com banco de dados");      
    //Seleciona o banco de dados
	$select_db = mysql_select_db("fimss");      
    //Abaixo atribuímos os valores provenientes do formulário pelo método POST
    $host_servidor = mysql_real_escape_string($_POST['host_servidor']); 
	$id_solic = mysql_real_escape_string($_POST['id_solic']); 
	//String com consulta SQL da inserção	
    $string_sql = "SELECT host_servidor FROM tb_servidores";
	//Realiza a consulta	
    mysql_query($string_sql,$conexao); 
	$resultado = mysql_query($string_sql, $conexao) or die(mysql_error());
	$row_resultado = mysql_fetch_assoc($resultado);
	$totalRows_resultado = mysql_num_rows($resultado);
	//Fecha conexão com banco de dados 	
	mysql_close($conexao); 
?>
<?php
	//Abrindo conexão com o banco para efetuar a query da tabela servidores
	mysql_select_db($database_conecta, $conecta);
	$query_menu_servidor = "SELECT `host_servidor` FROM `tb_servidores` WHERE (`id_solic` = '". $id_solic ."')";
	$menu_servidor = mysql_query($query_menu_servidor, $conecta) or die(mysql_error());
	$row_menu_servidor = mysql_fetch_assoc($menu_servidor);
	$totalRows_menu_servidor = mysql_num_rows($menu_servidor);	
	//Fecha conexão com banco de dados 	
	mysql_close($conecta); 
?>
<!--FIM Conexão com o banco de dados e querys-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>.:: COTI Central de Operacoes de TI</title>
<!--Declarando o jquery-->
<script src="js/jqueryUI/external/jquery/jquery.js"></script>
<script src="js/jqueryUI/jquery-ui.js"></script>
<link href="js/jqueryUI/jquery-ui.css" rel="stylesheet">
<!--FIM Jquery-->
<!--Iniciando Estilo CSS-->
<style type="text/css">
body {
	font: 70%/1.4 Verdana, Arial, Helvetica, sans-serif;
	background: #666;
	margin: 0;
	padding: 0;
	color: #000;
}
.container {
	width: 1200px;
	background: #FFFFFF;
	margin: 0 auto; 
}
.header {
	background: #FFFFFF;
}
.content {
	padding: 0px 0;
	background: #FFFFFF;
	height:400px;
	width:600px;

}
.footer {
	padding: 1px 0;
	background: #F3F3F3;
	text-align:left
}
.fltrt {  
	float: right;
	margin-left: 8px;
}
.fltlft { 
	float: left;
	margin-right: 8px;
}
.clearfloat { 
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
ul{
	padding:0;
	margin:0
}
li{
	list-style:none;
}
#menu{
	width:1200px;
}
#menu ul{
	background:#F3F3F3;
	height:20px;
	position:relative;
	padding:0 5px;
	border:1px dotted #aaaaaa;
	top:-2px;
}
#menu li{
	float:left;
	color:#F3F3F3;
}

#menu a,#menu a:visited{
	font-size:11px;
	display:block;
	width:20px;
	color:#333;
	font-weight:normal;
	padding:2px 45px 10px 0;
	text-decoration:none;
}
#menu a:hover{
	text-decoration:none;
	}
#menu li:hover > a{
	font-weight:normal;
	color:#FFF;
	background:#1A4876;
	}
#menu ul ul{
	width:100px;
	display:none;
	position:absolute;
	top:17px;
	height:auto;
	padding:0;
	}
#menu ul ul a,#menu ul ul a:visited{
	color:#333;
	width:100px;
	font-size:11px;
	padding:0px 0px;
	}
#menu ul ul li{
	clear:both;
	background:#FFFFFF;
	width:100px;
	}
#menu ul ul li:hover > a{
	clear:both;
	background:#F3F3F3;
	}
#menu li ul { 
z-index: 1; 
}

#tabs {
	width:1190px;
	height:300px;
	margin-top:-29px;
	border:dash;
}
<!--FIM Estilo CSS-->
</style>
</head>
<body>
<!--DIV Container-->
<div class="container">
<!--DIV Header-->
	<div class="header"><a href="#"><img src="images/header.jpg" alt="logo_net" name="logo_net" width="1200" height="29" id="logo_net" style="background: #C6D580; display:block;" /></a>
		<div id="botao_sair"><div style="position: absolute; margin-left:80px; margin-top: -24px; width:57px; height: 20px; left: 1155px; top: 29px;">
			<form name="botao_sair" method="post" action="http://localhost/sm/index.php">
				<input type="submit" name="botao_sair" id="botao_sair_2" value="Sair">
			</form>
							</div>
		</div>
	<!--DIV Menu CSS-->
	<div id="menu">
		<ul>
			<li>
				<a id="fimss" style="width:0px; height:5px;" href="">Fimss</a>
		<ul>
			<li>
				<a id="novo_fimss" title="Criar um novo FIMSS" href="http://localhost/sm/dados_iniciais.php">Novo Fimss</a>
			</li>
			<li>
				<a href="">Pesquisar Fimss</a>
			</li>
			<li>
				<a href="">Excluir Fimss</a>
			</li>
		</ul>
			</li>
			<li>
				<a id="monitor" style="width:7px; height:5px;" href="">Monitor</a>
		<ul>
		  <li>
				<a href="">Incluir Monitor</a>
			</li>
			<li>
				<a href="">Alterar Monitor</a>
			</li>
			<li>
				<a href="">Excluir Monitor</a>
			</li>
		</ul>
			</li>
			<li>
				<a style="width:21px; height:5px;" id="requisitos" href="">Requisitos</a>
		<ul>
			<li>
				<a href="">Banco de Dados</a>
			</li>
			<li>
				<a href="">Unix</a>
			</li>
			<li>
				<a href="">Windows</a>
			</li>
			<li>
				<a href="">SOA</a>
			</li>
		</ul>
			</li>
		</ul>
	</div>
	</div>
<br>
<br>
	<!--DIV Content-->
	<div class="content">
		<div id="tabs">
			<?php
				do {  
			?>
			<ul>
					<li><a href="#tabs-<?php echo $row_menu_servidor['host_servidor']?>"><?php echo $row_menu_servidor['host_servidor']?></a></li>
							<!--DIV Conteúdo da DIV tabs-->
		<div id="tabs-ndcingmgm001">		
			<div id="id_solic"><div style="position: absolute; margin-left:10px; margin-top:-10px; width:100px; height: 10;"><br/>
				<h4>ID Solicitação<br>
				<form name="form1" method="post" action="">
					<input name="id_solic" id="id_solic" type="text" value="<?php echo $_POST['id_solic'];?>" size="5" readonly="readonly">
					<br><br>
				</form>
			</div>
			</div>
		</div>
				<?php
					} while ($row_menu_servidor = mysql_fetch_assoc($menu_servidor));
					$rows = mysql_num_rows($menu_servidor);
						if($rows > 0) {
							mysql_data_seek($menu_servidor, 0);
							$row_menu_servidor = mysql_fetch_assoc($menu_servidor);
									}				
				?>			
			</ul>
	
		<div id="tabs-netpron10">
		TESTE1
		</div>	
		<div id="tabs-ndcingmgm002">
		TESTE
		</div>			
		</div>
	</div>
<div class="footer"><div style="position: absolute; width:1200px; height:50;"></div>
<div id="rodape"><b style="font-size: 8pt;">Usuário:</b> <?php echo $_SESSION['UsuarioNome'];?>
</div>  
</div>  
</body>
</html>
<!--Iniciando o tag scripts-->
<script>
jQuery(document).ready(function($){
	$("#tabs").tabs();
});
$(document).ready(function(){

 $("#menu li a").mouseover(function(){
 var index = $("#menu li a").index(this);
 $("#menu li").eq(index).children("ul").slideDown();

 if($(this).siblings('ul').size() > 0){
 return false;
 }
 });

 $("#menu li").mouseleave(function(){
 var index = $("#menu li").index(this);
 $("#menu li").eq(index).children("ul").slideUp();
 });
}); 

$("#tabs a").click(function( e ){
e.preventDefault();
var href= $( this ).attr("href");
$("#tabs-1").load( href +" #tabs-1");
});

var total = $(".tabs-1 ul").size();
$(".tabs-1").text(total);

var contador = 0;

function createElement(index){
    return '<div class="filho">Div '+index+'</div>';        
}


function addDiv(){
     $("#container").append(createElement(contador++));
}


$("#bt_add").click(addDiv);

</script>
<!--Finalizada a tag scripts-->
<?php
mysql_free_result($menu_servidor);
?>

Na DIV #tabs eu estou passando o Href como um POST, nome do servidor e estou pedindo para ele abrir a quantidade de abas de acordo com o resultado da query.

 

O meu problema é que eu preciso fazer o mesmo com o conteúdo dessas abas.

 

Na <div id="tabs-ndcingmgm001">, ao ínvés de ser o nome do servidor (ndcingmgm001) deveria ser uma varivável ou id igual ao que foi criado para o href da DIV #tabs.

 

Eu preciso que o ID das divs sejam dinâmicos ao carregar a página de acordo com o resultado da query.

 

Espero ter explicado de forma que todos entendam.

 

Obrigado.

 

Aguardo uma resposta.

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.