Select dinâmico com exibição dinâmica

Deisenvolvendo Web · Abril 6, 2008

Olá a todos!

Gostaria de saber se alguém pode me ajudar nessa tarefa:

Quando selecionarmos algo num select (que seus options vem de um banco) abaixo mostrará uma tabela com as informações desse option por exemplo:

//escrevemos nosso select dinâmico =)

<?

$sql = mysql_query("SELECT * FROM grupos ORDER BY nome_grupo");

while($linha=mysql_fetch_array($sql)) {

echo "<option value=\"" . $linha["id_grupo"] . "\">" . $linha["nome_grupo"] . "</option>";

}

?>

</select>

// ai quando o option ai em cima for selecionado aqui embaixo carregar a tabela de acordo como id do option

<table>

<tr>

</tr>

<?

while ($row = mysql_fetch_assoc($sel_dados)){

?>

<tr>

<td><?=$row["nome"];?></td> // aqui carrega de acordo com o select tipo se o selec diz que o grupo é cliente carrega os clientes desse grupo assim como os outros campos ai embaixo

</tr>

<?

}

?>

</table>

Eu sei fazer isso com select para select mas não select para table se alguém poder me ajudar ficaria muito grata!!!

=)

hinom · Abril 6, 2008

na tag <select> adicione o evento "onchange"

exemplo:

<select onchange="location.href=pagina.php?id_grupo="+this.value;>

na parte de baixo coloqe uma condicional que validará a postagem do valor de id_grupo e construirá uma query sql que fará a busca no banco de dados.

Deisenvolvendo Web · Abril 6, 2008

OII sim mas na verdade eu já fiz isso só q ele tem q ser muito mais dinâmico q eu imaginei tipo se eu colocar isso ele vai carregar todos os registros existentes na página e vai ficar super pesado tinha q ser algo q nem os select dinamico q passa a consulta para um iframe q retorna pro 2 option o conteudo abaixo coloquei o codigo mas tah meio errado

links para as páginas de exemplo:

http://prosler.oreo.kinghost.net/adminj/ex3.php

esse aqui é do select dinamico

http://prosler.oreo.kinghost.net/adminj/testt.php

codigo da tabela com optiond dinamico

<?

require ("include/conecta.php");

$query = "SELECT * FROM grupos ORDER BY nome_grupo";

$sel_dados = mysql_query($query);

while ($row = mysql_fetch_assoc($sel_dados))

{ ?>

function wm(cod){

if(document.forms[0].menu.value=="2"){

document.getElementById("2").style.display="block";

document.getElementById("dinheiro").style.display="none";

document.getElementById("<?=$row["id_grupo"]; $i=$row["id_grupo"];?>").style.display="none";

}

else if(document.forms[0].menu.value=="dinheiro"){

document.getElementById("dinheiro").style.display="block";

document.getElementById("cartao").style.display="none";

document.getElementById("<?=$row["id_grupo"]; $i=$row["id_grupo"];?>").style.display="none";

}

else if(document.forms[0].menu.value=="<?=$row["id_grupo"]; $i=$row["id_grupo"];?>"){

document.getElementById("<?=$row["id_grupo"]; $i=$row["id_grupo"];?>").style.display="block";

document.getElementById("2").style.display="none";

document.getElementById("dinheiro").style.display="none";

}

</script>

<? require("include/htm_head.php")?>

<body>

<form>

<?

$sql = mysql_query("SELECT * FROM grupos ORDER BY nome_grupo");

while($linha=mysql_fetch_array($sql)) {

echo "<option value=\"" . $linha["id_grupo"] . "\">" . $linha["nome_grupo"] . "</option>";

}

?>

</select>

</form>

<? $query = "SELECT * FROM contatos ";

$sel_dados = mysql_query($query);

while ($row = mysql_fetch_assoc($sel_dados))

{

?>

<div id="<?=$row["id_grupo"]; $i=$row["id_grupo"];?>" style="display:none">

<? $query = "SELECT * FROM contatos WHERE id_grupo = $i ORDER BY nome";

$sel_dados = mysql_query($query);

?>

<tr>

</tr>

<?

$class= 'trLine';

while ($row = mysql_fetch_assoc($sel_dados)){

if($class == 'trLine'){

$class= 'trAltLine';

}else{

$class= 'trLine';

}

?>

</tr>

<?

}

?>

</table>

</div>

<? $query = "SELECT * FROM contatos WHERE id_grupo = 2 ORDER BY nome";

$sel_dados = mysql_query($query);

?>

<tr>

</tr>

<?

$class= 'trLine';

while ($row = mysql_fetch_assoc($sel_dados)){

if($class == 'trLine'){

$class= 'trAltLine';

}else{

$class= 'trLine';

}

?>

</tr>

<?

}

?>

</table>

</div>

<? } ?>

hinom · Abril 6, 2008

http://prosler.oreo.kinghost.net/adminj/testt.php

vi a página.

quando escolhe a primeira categoria são listadas as sub-categorias.

ok

mas quando clica nas sub-categoria nao faz nada

o seu problema é esse ?

listar os produtos da sub-categoria ?

Deisenvolvendo Web · Abril 7, 2008

A página do select dinâmico tah certinha só coloquei como exemplo de quando clicar nela ela carrega o option de baixo de acordo com a option de cima mas isso se dá pq o option de cima manda uma informação para um iframe que o processa e joga de volta para página de onde forneceu essa informação carregando os options, até ai tudo bem ele não está carregando o option na própria página ele carrega no iframe e depois coloca na página senão essa página ficaria enorme pois o while iria escrever todo o conteudo do banco ao invés disso ele faz isso no iframe e não dá reload na página. A situação é que eu queria fazer o mesmo só que em vez de carregar a option carregar a tabela tipo a option vai manda via javascript para o iframe onde processa as informações e retorna pra página q de origem da option montando a tabela abaixo sem escrever ela . Vou mostrar como isso é feito de option para option e se alguém souber algo que possa ser feito de option para table.

Página que contém as options:

testt.php

<?

require ("include/conecta.php");

require("include/htm_head.php");

$sql = mysql_query("SELECT * FROM categorias order by nome_categoria");

?>

function carregar(){

Combo1 = document.Cadastro.UF; //ALTERE AQUI PARA SEU FORM E 1º SELECT

Combo2 = document.Cadastro.Cidades; //ALTERE AQUI PARA SEU FORM E 2º SELECT

var url;

url = 'remote.php?UF='+Combo1[Combo1.selectedIndex].value;

Combo2.options.length = 0;

addItem(Combo2,"Aguarde...carregando","",false,Combo2.length)

myIframe.location = url;

Combo2.focus()

}

function inicia(){

local1 = new Array();

var maximo1, i;

local1 = myIframe.loc;

maximo1 = local1.length;

Combo2.options.length = 0;

addItem(Combo2,'Selecione a Linha de produtos desejada.','',false,Combo2.length);

for (i=0;i<maximo1;i++){

addItem(Combo2,local1[1],local1[0],false,Combo2.length);

}

function addItem(obj,strText,strValue,blSel,intPos){

var newOpt,i,ArTemp,selIndex;

selIndex = (blSel)?intPos:obj.selectedIndex;

newOpt = new Option(strText,strValue);

Len = obj.options.length+1

if (intPos > Len) return

obj.options.length = Len

if (intPos != Len) {

ArTemp = new Array();

for(i=intPos;i<obj.options.length-1;i++)

ArTemp = Array(obj.options.text,obj.options.value);

for(i=intPos+1;i<Len;i++)

obj.options = new Option(ArTemp[i-1][0],ArTemp[i-1][1]);

}

obj.options[intPos] = newOpt;

if (selIndex > intPos)

obj.selectedIndex = selIndex+1;

else if (selIndex == intPos)

obj.selectedIndex = intPos;

}

</script>

</head>

<body>

<div style="DISPLAY: none; POSITION: absolute" align="left">

<IFRAME src name="myIframe" id="myIframe" width="400" height="100" marginwidth="0" marginheight="0"></IFRAME>

</div>

<form method="post" name="Cadastro">

Categoria do Produto:<br><select name="UF" class="text" onChange="carregar();">

<option value="">Selecione a Categoria do Produto</option>

<?

while($linha=mysql_fetch_array($sql)) {

echo "<option value=\"" . $linha["id_categoria"] . "\">" . $linha["nome_categoria"] . "</option>";

}

?>

</select><br>

Linha do Produto:<br><select class="text" name="Cidades"></select>

</form>

<?

mysql_close($conexao);

?>

</body>

</html>

página que carrega as linhas:

carregalinhas.php

<?

require ("include/conecta.php");

$UF = $_GET['UF'];

$auxsql = "SELECT DISTINCT nome_linha, id_linha FROM linhas WHERE id_categoria='{$UF}' order by nome_linha";

$sql = mysql_query($auxsql);

if(!$sql){echo mysql_error();exit();}

?>

<script>

loc = new Array(<?=mysql_num_rows($sql)?>)

for (i=0; i < <?=mysql_num_rows($sql)?>; i++) {

loc = new Array(2)

for (j=0; j < 2; j++) {

loc[j] = "0"

}

<? $j = 0;

while ($linha = mysql_fetch_array($sql)) {?>

loc[<?=$j?>][0] = "<?=$linha[1]?>";

loc[<?=$j?>][1] = "<?=$linha[0]?>";

<?$j++;

}

?>

parent.inicia();

<?

mysql_close($conexao);

?>

</script>

então em vez de ser com options para options tem como fazer de option para table????

hinom · Abril 7, 2008

entendi

antes de apresentar uma solução, gostaria de saber qual o nivel de conhecimento em html e javascript ?

Deisenvolvendo Web · Abril 7, 2008

Num sei quase nada de Javascript, html tenho nivel intermediário e php também conheço bastante se o código já vem pronto eu trabalho mais pegando código pronto e modificando do que criando um. mas entendo bemde lógica de programação e sei q esse poblema ai deve ser algo q ao invés dele criar uma new opition no javascript ele deveria criar um new td, tr alguma coisa assim mas eu num sei fazer :wacko: me ajudaaaaaa :wacko: :wacko: :wacko: :wacko:

Deisenvolvendo Web · Abril 8, 2008

esqueceram de mim :unsure:

hinom · Abril 8, 2008

procure por manipulação de objetos por DOM

pesquise "javascript DOM"

no forum, na seção javascript tem diversos tópicos sobre o assunto.

Num sei quase nada de Javascript, html tenho nivel intermediário e php

o seu nível é básico / principiante.

sugiro que estude mais sobre html e javascript.

pois o que você está fazendo é um processo fora de ordem

seria o mesmo que entrar na escola começando pela 3ª série do 2ªgrau sem saber o alfabeto.

Deisenvolvendo Web · Abril 8, 2008

hinom não me abandooooneee!!! eu só queria transformar a lógica de escrever new options em new tr, td eu sei q tem como fazer só num sei o jeito certo de fazer se você sabe me ajudiiiiiiii please :wacko: :wacko: :wacko: :wacko: num mi deixiii

hinom · Abril 8, 2008

procure por "javascript dom"

http://www.w3.org/DOM/

dicas:

createElement

appendChild

createTextNode

setAttribute

a tabela que deseja manipular deve possuir uma estrutura conforme a padronização do W3C

o metodo DOM funcionará se for declarada a tag <tbody> na tabela.

http://www.w3.org/TR/html401/struct/tables.html

http://www.w3.org/TR/html401/struct/tables.html#edef-TBODY

tudo aqui com exemplos:

http://developer.mozilla.org/en/docs/Trave..._DOM_Interfaces

Deisenvolvendo Web · Abril 8, 2008

eu só queria transformar minha option em td =( http://forum.imasters.com.br/public/style_emoticons/default/blush.gif :wacko: :unsure:

Deisenvolvendo Web · Abril 8, 2008

Consegui!! Vou postar o código para vocês

berkowitz · Abril 8, 2008

OBAAAAAAAA!!!!!!! http://forum.imasters.com.br/public/style_emoticons/default/clap.gif

Arquivado

Select dinâmico com exibição dinâmica

Recommended Posts

Deisenvolvendo Web 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

hinom 5

Compartilhar este post

Link para o post

Compartilhar em outros sites

Deisenvolvendo Web 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

hinom 5

Compartilhar este post

Link para o post

Compartilhar em outros sites

Deisenvolvendo Web 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

hinom 5

Compartilhar este post

Link para o post

Compartilhar em outros sites

Deisenvolvendo Web 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Deisenvolvendo Web 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

hinom 5

Compartilhar este post

Link para o post

Compartilhar em outros sites

Deisenvolvendo Web 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

hinom 5

Compartilhar este post

Link para o post

Compartilhar em outros sites

Deisenvolvendo Web 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Deisenvolvendo Web 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

berkowitz 2

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Fóruns

Tempo Real

Informação importante