[Resolvido] apresentação de resultados

Hellxande · Janeiro 18, 2012

Salve galera, estou precisando de ajuda.

Tenho uma Tabela chamada Franquia, onde cadastro os dados dos Franqueados da Empresa. Meu objetivo é realizar a apresentação destes franqueados da seguinte forma:

'1º O Estado e na frente do mesmo um Sinal de +

UF ( + )

' Ao clicar no sinal de + apresentará as Franquias daquele Estado.

Dados cadastrais de todas as Franquias deste Estados

Neste momento tenho conseguido fazer a primeira parte utilizando esta Seleção ( SELECT DISTINCT FranquiaEnderecoUF FROM Franquia Order By FranquiaEnderecoUF ASC )

O problema esta no momento de escrever os dados de cada Franquia por estado, pois ao clicar no Sinal de + fica sempre apresentado a mesma.

Segue abaixo os trecho do meu Código.

' Seleção da Franquia fazendo a distinção por estado
TabFranquiaGeral = Server.CreateObject("adodb.recordset")
sql = "SELECT DISTINCT FranquiaEnderecoUF FROM Franquia Order By FranquiaEnderecoUF ASC"
set TabFranquiaGeral = Conexao.execute(sql)

<style>
/* Classe que mostra e oculta a Franquia*/
.esconder { display:none; visibility:hidden; }
.mostrar { display:block;Visibility:visible; }
</style>

<script>
/* Função para mostrar e ocultar os dados das Franquias*/
var strId = ""; var mosTod = true;
function labelDetalhe(strIdDetalhe,strClasse){ var id = document.getElementById(strIdDetalhe); if(typeof(id) == 'object'){ if(strClasse == 'mostrar'){ id.innerHTML = '<i>-</i>'; }else{ id.innerHTML = '+'; } } }
function mostrarItem(strItem, strIdDet){ var d = document; var obj = d.getElementById(strItem); if(mosTod){ if(obj.className == 'mostrar'){ obj.className = 'esconder'; }else{ obj.className = 'mostrar'; } labelDetalhe(strIdDet, obj.className); strId = strItem; }else{ if(strId == ''){ obj.className = 'mostrar'; strId = strItem; }else if(strId == strItem){ obj.className = 'esconder'; strId = ''; }else{ obj.className = 'mostrar'; d.getElementById(strId).className = 'esconder'; strId = strItem; }		labelDetalhe(strIdDet, obj.className); } }
</script>

<%
' Verificação se existe alguma Franquia a ser apresentada com base no Select Distinct
IF TabFranquiaGeral.EOF Then
 Response.Write("Nenhuma Pergunta Franquia a ser apresentada !!")
Else
 count = 0
 Do While Not TabFranquiaGeral.EOF

 ' Variável que recebe o Nome do Estado a ser apresentado
 FranquiaEnderecoUF = TabFranquiaGeral("FranquiaEnderecoUF")

%>
<!-- Inicio da Montagem da tabela de apresentação das franquias -->
		<table width="900" border="0" align="center" cellpadding="0" cellspacing="0" id="Franquias">
		  <tr>
			<td colspan="2" align="left" valign="middle">
			<a href="java script:void(0);"  onclick="mostrarItem('item<%=i%>','det<%=i%>');">
			<strong class="TituloGrandePreto"><%=FranquiaEnderecoUF%></strong> (<span class='CampoPreto' id="det<%=i%>"> + </span>)
			</a>
			  </td>
			</tr>
		  <tr>
			<td width="50"> </td>
			<td width="850" align="left" valign="middle">
				<%
				TabFranquiaDetalhes = Server.CreateObject("adodb.recordset")
				sql = "SELECT * FROM Franquia where FranquiaEnderecoUF = '"&FranquiaEnderecoUF&"' Order By FranquiaNomeFantasia ASC"
				set TabFranquiaDetalhes = Conexao.execute(sql)

				count = 0
				While Not TabFranquiaDetalhes.EOF
				NomeFantasia = TabFranquiaDetalhes("FranquiaNomeFantasia")
				%>
				<div class="esconder" id='item<%=i%>'>
				<!-- Escrevendo os dados de cada Franquia -->
				<%=NomeFantasia%>
				<!-- Escrevendo os dados de cada Franquia -->
				</div>
			<%
			TabFranquiaDetalhes.MoveNext
			Count=Count+1
			Loop
			%>
			</td>
			</tr>
		  </table>
		  <%
		  TabFranquiaGeral.MoveNext
		  Count=Count+1
		  Loop
					  End IF
%>

Qualquer sugestão é bem vinda.

Desde já agradeço.

xanburzum · Janeiro 18, 2012

você pode fazer tipo um menu Treeview, faça uma busca no fórum que exitem alguns exemplos

Public2004 · Janeiro 18, 2012

Olá amigo, é basicamente um loop sobre loop, ou seja, lista com o distinct os estados e a cada estado lista os dados deste, terminando vai para o próximo estado e assim por diante...

Não se preocupe com o javascript agora, faça a coisa funcionar primeiro depois "embeleza"...

Att.

Hellxande · Janeiro 20, 2012

Olá amigo, é basicamente um loop sobre loop, ou seja, lista com o distinct os estados e a cada estado lista os dados deste, terminando vai para o próximo estado e assim por diante...

Não se preocupe com o javascript agora, faça a coisa funcionar primeiro depois "embeleza"...

Att.

Prezado Public2004, primeiramente obrigado pela sugestão e diante da mesma consegui montar o código ASP para tal situação, porém acredito estar errando no posicionamento do mesmo, ou errando no próprio JavaScript, pois ao clicar no link sempre mostra o mesmo conteúdo, exemplo tenho cadastrado 4 Franquias, sendo 1 para o estado do AC, 1 para o estado da BA e 2 para o estado do PR, mas qdo clico no link da BA ou PR apresenta a Franquia do AC.

Segue abaixo o Código completo:

<!--#include file="Conexao.asp" -->
<%
Session.LCID = 1046
Conexao.CursorLocation=3

TabEstado = Server.CreateObject("adodb.recordset")
sql = "SELECT DISTINCT Franquia.FranquiaEnderecoUF FROM Franquia INNER JOIN Estado ON Franquia.EstadoID = Estado.EstadoID ORDER BY Franquia.FranquiaEnderecoUF ASC"
set TabEstado = Conexao.execute(sql)

%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>


<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="estilo.css" rel="stylesheet" type="text/css" media="all" />

<style>
/*MOSTRANDO E OCULTANDO SERVIÇOS*/
.esconder { display:none; visibility:hidden; }
.mostrar { display:block;Visibility:visible; }
</style>

<script>
/*FUNÇÃO PARA MOSTAR E OCULTAR DETALHES DE UM SERVIÇO*/
var strId = ""; var mosTod = true;
function labelDetalhe(strIdDetalhe,strClasse){ var id = document.getElementById(strIdDetalhe); if(typeof(id) == 'object'){ if(strClasse == 'mostrar'){ id.innerHTML = '<i>-</i>'; }else{ id.innerHTML = '+'; } } }
function mostrarItem(strItem, strIdDet){ var d = document; var obj = d.getElementById(strItem); if(mosTod){ if(obj.className == 'mostrar'){ obj.className = 'esconder'; }else{ obj.className = 'mostrar'; } labelDetalhe(strIdDet, obj.className); strId = strItem; }else{ if(strId == ''){ obj.className = 'mostrar'; strId = strItem; }else if(strId == strItem){ obj.className = 'esconder'; strId = ''; }else{ obj.className = 'mostrar'; d.getElementById(strId).className = 'esconder'; strId = strItem; }		labelDetalhe(strIdDet, obj.className); } }
</script>

</head>

<body>

<%
IF TabEstado.EOF Then
Response.Write("Nenhuma Pergunta Franquia a ser apresentada !!")
Else
count = 0
Do While Not TabEstado.EOF
UF = TabEstado("FranquiaEnderecoUF")

TabFranquiaDetalhada = Server.CreateObject("adodb.recordset")
sql = "SELECT * FROM Franquia where FranquiaEnderecoUF = '"&UF&"' ORDER BY FranquiaNomeFantasia ASC"
set TabFranquiaDetalhada = Conexao.execute(sql)

%>
<table width="900" border="0" align="center" cellpadding="0" cellspacing="0" id="Franquias">
 <tr>
   <td colspan="2" align="left" valign="middle">
<a href="javascript:void(0);"  onclick="mostrarItem('item<%=i%>','det<%=i%>');">
   <strong class="TituloGrandePreto"><%=UF%></strong> (<span class='CampoPreto' id="det<%=i%>"> + </span>)
   </a>
   </td>
 </tr>
 <tr>
   <td width="50"> </td>
   <td width="850" align="left" valign="middle">


<%
IF NOT TabFranquiaDetalhada.EOF Then
	count = 0
	Do While Not TabFranquiaDetalhada.EOF
	NomeFantasia = TabFranquiaDetalhada("FranquiaNomeFantasia")
%>
   <div class="esconder" id='item<%=i%>'>
<%	Response.Write(""&NomeFantasia&"<br>") %> 
   <%

	TabFranquiaDetalhada.MoveNext
	Count=Count+1
	Loop

Else
End IF
%>

   </div>
   </td>
 </tr>
</table>
<%
TabEstado.MoveNext
Count=Count+1
Loop
End IF
%>
</body>
</html>

Acredito ser algum erro banal, porém não estou conseguindo identificar, sendo assim qq sugestão é bem vinda.

Atenciosamente

saloeric · Janeiro 20, 2012

vou-lhe dar um exemplo com jquery e divs, depois tente adaptar


então você monta assim as divs


               <div>estado 1 <a class="maisdetalhe" href="#">(+)</a></div>
	<div class="div-oculta" style="display:none;">aqui mete todo o conteudo referente ao estado 1</div>
               <div>estado 2 <a class="maisdetalhe" href="#">(+)</a></div>
               <div class="div-oculta" style="display:none;">aqui mete todo o conteudo referente ao estado 2</div>
               <div>estado 3 <a class="maisdetalhe" href="#">(+)</a></div>
               <div class="div-oculta" style="display:none;">aqui mete todo o conteudo referente ao estado 3</div>

agora no jquery



			$(function(){
				$(".maisdetalhe").click(function(){
					$(".div-oculta").hide();
					$(this).parent().next().show();
					return false;
				});
			});

Public2004 · Janeiro 20, 2012

Olá amigo, como sugeri anteriormente, faça o ASP funcionar primeiro depois se preocupe com o JavaScript.

Verifique se está trazendo todos os resultados. Quando tiver certeza que está tudo certo, aí sim se preocupe com a formatação e parte visual, CSS, Javascript, etc.

Att.

Hellxande · Janeiro 21, 2012

Olá amigo, como sugeri anteriormente, faça o ASP funcionar primeiro depois se preocupe com o JavaScript.

Verifique se está trazendo todos os resultados. Quando tiver certeza que está tudo certo, aí sim se preocupe com a formatação e parte visual, CSS, Javascript, etc.

Att.

Prezado Public2004

O Código ASP funciona, ou seja, sem usar o javascript só realizando a apresentação bruta das informações, funciona certinho, apresenta assim:

AC

Franquia 1

BA

Franquia 2

PR

Franquia 3

Franquia 4

Mas ai qdo coloco o Javascript é como se o 2º While falhase, pois ao clicar no link referente a BA sempre abre o Franquia 1 e o mesmo ocorre com o PR.

Atenciosamente

xanburzum · Janeiro 21, 2012

use uma forma de treeview, fica bom

Public2004 · Janeiro 23, 2012

Olá amigo, tem certeza que está tudo certo com o ASP?

Para que serve a variável "count"? E o que é a variável "i"? Veja qual vai utilizar e corrija.

Porque um contador no segundo "loop"? Além de desnecessário, ainda quebra o contador do primeiro...

Porque a abertura da tag "div" do segundo loop? Ela deve ficar no primeiro, os resultados é que ficam no segundo loop.

Att.

Hellxande · Fevereiro 2, 2012

Prezado Amigos, gostaria de agradecer a todos que me enviaram sugestões, consegui resolver o problema usando a dica do Saloeric, sendo assim vou postar aqui o Código Fonte do arquivo de Teste que fiz antes de empregar no Projeto Final de forma a ajudar outras pessoas.

<!--#include file="Conexao.asp" -->
<%
Session.LCID = 1046
Conexao.CursorLocation=3

' Select da Tabela Franquia fazendo a Distinção por Estado
TabFranquiaUF = Server.CreateObject("adodb.recordset")
sql = "SELECT DISTINCT FranquiaEnderecoUF FROM Franquia Order By FranquiaEnderecoUF ASC"
set TabFranquiaUF = Conexao.execute(sql)

%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="estilo.css" rel="stylesheet" type="text/css" media="all" />

<!-- Carregamento do arquivo JQuery -->
<script type="text/javascript" src="Scripts/jquery.js" /></script>

<!-- Início do Script de apresentação detalhada dos Dados -->
<script type="text/javascript">
$(function(){
$(".maisdetalhe").click(function(){
	$(".div-oculta").hide();
	$(this).parent().next().show();
	return false;
	});
});
</script>
<!-- Fim do Script de apresentação detalhada dos Dados -->
</head>
<body>
<table width="950" border="0" align="center" cellpadding="0" cellspacing="0">
 <tr>
   <td>
<%
' Verifica se o Select retornou vazio ou não
IF TabFranquiaUF.EOF Then
Response.Write("Nenhuma Pergunta Franquia a ser apresentada !!")
Else
count = 0
Do While Not TabFranquiaUF.EOF
UF = TabFranquiaUF("FranquiaEnderecoUF")

' Select da Tabela Franquia com base na Variável UF
TabFranquiaDetalhada = Server.CreateObject("adodb.recordset")
sql = "SELECT * FROM Franquia where FranquiaEnderecoUF = '"&UF&"' ORDER BY FranquiaNomeFantasia ASC"
set TabFranquiaDetalhada = Conexao.execute(sql)

%>
<div align="left">
<%
' Início da apresentação das Imagens e Nomes dos Estados
Select Case UF
Case "AC"
Response.Write("<img src='Imgs\estados\AC.png' width='40' height='24' /> <span class='TituloPequenoPreto'>AC - ACRE</span>")
Case "AL"
Response.Write("<img src='Imgs\estados\AL.png' width='40' height='24' /> <span class='TituloPequenoPreto'>AL - ALAGOAS</span>")
Case "AP"
Response.Write("<img src='Imgs\estados\AP.png' width='40' height='24' /> <span class='TituloPequenoPreto'>AP - AMAPÁ</span>")
Case "AM"
Response.Write("<img src='Imgs\estados\AM.png' width='40' height='24' /> <span class='TituloPequenoPreto'>AM - AMAZONAS</span>")
Case "BA"
Response.Write("<img src='Imgs\estados\BA.png' width='40' height='24' /> <span class='TituloPequenoPreto'>BA - BAHIA</span>")
Case "CE"
Response.Write("<img src='Imgs\estados\CE.png' width='40' height='24' /> <span class='TituloPequenoPreto'>CE - CEARÁ</span>")
Case "ES"
Response.Write("<img src='Imgs\estados\ES.png' width='40' height='24' /> <span class='TituloPequenoPreto'>ES - ESPIRITO SANTO</span>")
Case "GO"
Response.Write("<img src='Imgs\estados\GO.png' width='40' height='24' /> <span class='TituloPequenoPreto'>GO - GOÍAS</span>")
Case "MA"
Response.Write("<img src='Imgs\estados\MA.png' width='40' height='24' /> <span class='TituloPequenoPreto'>MA - MARANHÃO</span>")
Case "MT"
Response.Write("<img src='Imgs\estados\MT.png' width='40' height='24' /> <span class='TituloPequenoPreto'>MT - MATO GROSSO</span>")
Case "MS"
Response.Write("<img src='Imgs\estados\MS.png' width='40' height='24' /> <span class='TituloPequenoPreto'>MS - MATO GROSSO DO SUL</span>")
Case "MG"
Response.Write("<img src='Imgs\estados\MG.png' width='40' height='24' /> <span class='TituloPequenoPreto'>MG - MINAS GERAIS</span>")
Case "PA"
Response.Write("<img src='Imgs\estados\PA.png' width='40' height='24' /> <span class='TituloPequenoPreto'>PA - PARÁ</span>")
Case "PB"
Response.Write("<img src='Imgs\estados\PB.png' width='40' height='24' /> <span class='TituloPequenoPreto'>PB - PARAIBA</span>")
Case "PR"
Response.Write("<img src='Imgs\estados\PR.png' width='40' height='24' /> <span class='TituloPequenoPreto'>PR - PARANÁ</span>")
Case "PE"
Response.Write("<img src='Imgs\estados\PE.png' width='40' height='24' /> <span class='TituloPequenoPreto'>PE - PERNAMBUCO</span>")
Case "PI"
Response.Write("<img src='Imgs\estados\PI.png' width='40' height='24' /> <span class='TituloPequenoPreto'>PI - PIAUÍ</span>")
Case "RJ"
Response.Write("<img src='Imgs\estados\RJ.png' width='40' height='24' /> <span class='TituloPequenoPreto'>RJ - RIO DE JANEIRO</span>")
Case "RN"
Response.Write("<img src='Imgs\estados\RN.png' width='40' height='24' /> <span class='TituloPequenoPreto'>RN - RIO GRANDE DO NORTE</span>")
Case "RS"
Response.Write("<img src='Imgs\estados\RS.png' width='40' height='24' /> <span class='TituloPequenoPreto'>RS - RIO GRANDE DO SUL</span>")
Case "RO"
Response.Write("<img src='Imgs\estados\RO.png' width='40' height='24' /> <span class='TituloPequenoPreto'>RO - RONDÔNIA</span>")
Case "RR"
Response.Write("<img src='Imgs\estados\RR.png' width='40' height='24' /> <span class='TituloPequenoPreto'>RR - RORAIMA</span>")
Case "SC"
Response.Write("<img src='Imgs\estados\SC.png' width='40' height='24' /> <span class='TituloPequenoPreto'>SC - SANTA CATARINA</span>")
Case "SP"
Response.Write("<img src='Imgs\estados\SP.png' width='40' height='24' /> <span class='TituloPequenoPreto'>SP - SÃO PAULO</span>")
Case "SE"
Response.Write("<img src='Imgs\estados\SE.png' width='40' height='24' /> <span class='TituloPequenoPreto'>SE - SERGIPE</span>")
Case "TO"
Response.Write("<img src='Imgs\estados\TO.png' width='40' height='24' /> <span class='TituloPequenoPreto'>TO - TOCANTINS</span>")
Case Else
Response.Write("<img src='Imgs\estados\DF.png' width='40' height='24' /> <span class='TituloPequenoPreto'>DF - DISTRITO FEDERAL</span>")
End Select
' Fim da apresentação das Imagens e Nomes dos Estados
%>
( <a class="maisdetalhe" href="#">+</a> ) </div>
<div align="center" class="div-oculta" style="display:none;">
<%
' Verifica se existem dados detalhado a serem apresentados
IF NOT TabFranquiaDetalhada.EOF Then
	count = 0
	Do While Not TabFranquiaDetalhada.EOF
	NomeFantasia = TabFranquiaDetalhada("FranquiaNomeFantasia")
	Endereco = TabFranquiaDetalhada("FranquiaEndereco")
	EnderecoNumero = TabFranquiaDetalhada("FranquiaEnderecoNumero")
	EnderecoComplemento = TabFranquiaDetalhada("FranquiaEnderecoComplemento")
	EnderecoBairro = TabFranquiaDetalhada("FranquiaEnderecoBairro")
	EnderecoCEP = TabFranquiaDetalhada("FranquiaEnderecoCEP")
	EnderecoCidade = TabFranquiaDetalhada("FranquiaEnderecoCidade")
	EnderecoUF = TabFranquiaDetalhada("FranquiaEnderecoUF")
	Telefone = TabFranquiaDetalhada("FranquiaTelefonePrincipal")
	Email = TabFranquiaDetalhada("FranquiaEmail")
	Link = TabFranquiaDetalhada("FranquiaLinkGoogle")

	' Início da monta um nova Tabela para apresentar os Dados detalhados de cada Franquia, usando as variáveis acima
	Response.Write("<br><table width='900' border='0' align='center' cellpadding='0' cellspacing='0' id='Apresentacao'><tr><td align='left' valign='middle' class='TituloPequenoPreto'>"&NomeFantasia&"</td></tr><tr><td align='left' valign='middle' class='CampoPreto'>"&Endereco&" - "&EnderecoNumero&" - "&EnderecoComplemento&"</td></tr><tr><td align='left' valign='middle' class='CampoPreto'>"&EnderecoBairro&" - "&EnderecoCEP&" - "&EnderecoCidade&" - "&EnderecoUF&"</td></tr><tr><td align='left' valign='middle' class='CampoPreto'>"&Telefone&"</td></tr><tr><td align='left' valign='middle' class='CampoPreto'>"&Email&"</td></tr><tr><td align='right' valign='middle' class='CampoPreto'>Localize no Google Maps <a href='"&Link&"' target='_new'><img src='Imgs/mapa.png' width='20' height='20' /></a></td></tr><tr><td align='left' valign='middle' class='CampoPreto'> </td></tr><tr><td><hr /></td></tr></table>")
	' Fim da monta um nova Tabela para apresentar os Dados detalhados de cada Franquia, usando as variáveis acima

	TabFranquiaDetalhada.MoveNext
	Count=Count+1
	Loop

Else
End IF
%>
</div>
<%
TabFranquiaUF.MoveNext
Count=Count+1
Loop
End IF
%>
   </td>
 </tr>
</table>
</body>
</html>

Novamente obrigados a todos.

Atenciosamente

Arquivado

[Resolvido] apresentação de resultados

Recommended Posts

Hellxande 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

xanburzum 169

Compartilhar este post

Link para o post

Compartilhar em outros sites

Public2004 79

Compartilhar este post

Link para o post

Compartilhar em outros sites

Hellxande 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

saloeric 1

Compartilhar este post

Link para o post

Compartilhar em outros sites

Public2004 79

Compartilhar este post

Link para o post

Compartilhar em outros sites

Hellxande 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

xanburzum 169

Compartilhar este post

Link para o post

Compartilhar em outros sites

Public2004 79

Compartilhar este post

Link para o post

Compartilhar em outros sites

Hellxande 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

PHP+Codeigniter - Dúvida em Relação a Teclas

Conexão mysql com outro domínio

[Resolvido] JavaScript - Exibir logo dentro da Tabela html

Fóruns

Tempo Real

Informação importante