Ir para conteúdo

POWERED BY:

Arquivado

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

aw10

Preencher múltiplos type text do form, através de um select com bd

Por , em Javascript

Recommended Posts

aw10    0

aw10
Postado

Seria possível preencher múltiplos campos type text de um form apartir de uma select.

Por exemplo: seleciono um nome de um select conectado ao banco de dados, e os campos sobrenome e dependentes seriam preenchidos automaticamente.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Exemplo:

 

http://wbruno.com.br/ajax/combobox-preenche-input-ajax/

Compartilhar este post

Link para o post
Compartilhar em outros sites

aw10    0

aw10
Postado

William Bruno excelente exemplo.

Segui seu exemplo, consegui o select com os dados resgatados do bd.

Mas não encontro maneira de fazer com que os campos sejam preenchidos com os demais dados.

Se possível me mostra onde estou errando, não recebo nenhuma mensagem de erro, só não são preenchidos os campos do form.

 

php com a função de exemplo modificado às minhas necessidades:

<?php
	include "../Connections/connect.php";
	/**
	 * função que retorna o select
	 */
	function montaSelect()
	{
	$sql = "SELECT funcionario.id_funcionario, funcionario.nome, funcionario.sobrenome, contato.id_contato, contato.email FROM funcionario, contato WHERE contato.id_funcionario = funcionario.id_funcionario ";
		$query = mysql_query( $sql );

		if( mysql_num_rows( $query ) > 0 )
		{
			while( $dados = mysql_fetch_assoc( $query ) )
			{
				$opt .= '<option value="'.$dados['id_funcionario'].'">'.$dados['nome'].'</option>';
			}
		}
		else
			$opt = '<option value="0">Nenhum funcionario cadastrado</option>';

		return $opt;
	}

	/**
	 * função que devolve em formato JSON os dados do cliente
	 */
	function retorna( $id )
	{
		$id = (int)$id;
		

	$sql = "SELECT funcionario.id_funcionario, funcionario.nome, funcionario.sobrenome, contato.id_contato, contato.id_funcionario, contato.email FROM funcionario, contato WHERE funcionario.id_funcionario = {$id}"or die (mysql_error());
		$query = mysql_query( $sql );


		$arr = Array();
		if( mysql_num_rows( $query ) )
		{
			while( $dados = mysql_fetch_object( $query ) )
			{
				$arr['sobrenome'] = $dados->sobrenome;
				$arr['email']     = $dados->email;
			}
		}
		else
			$arr[] = 'sobrenome: não encontrado';

		return json_encode( $arr );
	}

/* só se for enviado o parâmetro, que devolve o combo */
if( isset($_GET['id_funcionario']) )
{
	echo retorna( $_GET['id_funcionario'] );
}
?>

php com o jquery exemplificado e modificado segundo as minhas necessidades:

<!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>
<?php include('../Connections/head_two.php'); 
  
session_start(); // Inicia a session
include "functions.php"; // arquivo de funções.
session_checker(); // chama a função que verifica se a session iniciada da acesso à página.

?>
<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon">
          
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
	<script type="text/javascript">
	$(document).ready(function(){
		$("select[name='nome']").change(function(){
			var sobrenome = $("input[name='sobrenome']");
			var email     = $("input[name='email']");

			$( sobrenome ).val('Carregando...');
			$( email )    .val('Carregando...');

				$.getJSON(
					'funcao.form.php',
					{ id_funcionario: $( this ).val() },
					function( json )
					{
						$( sobrenome ).val( json.sobrenome );
						$( email ).val( json.email );
					}
				);
		});
	});
	</script>
<body onload="MM_preloadImages('webpg/boletimd.png')">

<div id="tudo">
      <div id="tira_cab">
        <div id="tira_um">Pirassununga</div>
        <div id="tira_dois">Ensino Médio</div>
        <div id="tira_tres"> </div>
        <div id="tira_quatro"><?php include('../index/home_dois.php'); ?></div>
        <div id="tira_cinco"><?php include('../index/social_dois.php'); ?></div>
      <!--fim de tira_cab--></div>
      
    <div id="logao"></div>
    <div id="centru_box">
    
        <div class="tarja_box">
	<?php include('index/testa.php'); ?>
		</div>
    
    <div class="grid_7" id="cntradauto">
		
	<div class="contenido2">
	<h2 class=laranja>Conectado a: <?php echo convertem( " ". $_SESSION['nome'] ." ". $_SESSION['sobrenome'] ."!",1);?></h2> 
    </div>	
	
    <?php include('cadastro.usuario.php')?>
    </div>  
    
 </div>

<!--fim do tudo--></div>

<div id="rodape">
<div id="boxrodape">
<div class="textrdp"><?php include('../index/rodape.php'); ?></div>
</div>
</div>

</body>
</html>

Form de cadastro:

<?php require('../Connections/connect.php');?>
<div id="login">
    <form label class="intexto" name="cadastro" method="post" action="cadastrar.php">
    
    <label> 
    <span class="laranjex">Cognome(Apelido) do Funcionário</span>  
		<select name="nome" onchange="muda_nome()" style="text-transform:uppercase;">
        <option value="">Selecione...</option>
        <?php
		include 'funcao.form.php';
	         echo montaSelect();
			?>
		</select>
    
    </label>
		<label>sobrenome: <input name="sobrenome" type="text" disabled="disabled" value="" /></label>
		<label>email: <input type="text" name="email" disabled="disabled" value="" /></label>
    
    <label> 
    <span>Email</span> 
    <input name="email" type="text" id="email" value=" " /><br />
    </label>
    
    <label> 
    <span>Nome de Usuário</span> 
    <input name="usuario" type="text" id="usuario" value=" " /><br />
    </label>
    
    <label> 
    <span>+ informações sobre funcionario</span> 
    <textarea name="info" id="info" rows="10"> </textarea> <br />
    </label>
    
    <label>  
    <input type="submit" class="send" name="Submit" value="Cadastrar" /> <br />
    </label>
     
    </form>
</div>

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Debugue:

 

http://wbruno.com.br/javascript-puro/como-debugar-javascript-firefox-erros-comuns/

http://wbruno.com.br/ajax/como-debugar-ajax-firebug/

Compartilhar este post

Link para o post
Compartilhar em outros sites

aw10    0

aw10
Postado

Willam Bruno... consegui achar diversos erros de "raciocínio" da minha parte.

Continuarei analisando as informações que seus links me proporcionam.

Por enquanto obrigado novamente.

Compartilhar este post

Link para o post
Compartilhar em outros sites

xanburzum    169

xanburzum
Postado

de uma forma geral será fazer sua SQL e atribuir o recordset no value do campo

Compartilhar este post

Link para o post
Compartilhar em outros sites

aw10    0

aw10
Postado

Bom... usei todas as dicas dos links do William Bruno... o select funciona perfeitamente com os dados do bd, os erros iniciais foram corrigidos, mas ainda não consigo entender porque só carrega apenas dois dos quatro dados das tabelas relacionadas.

Em uma tentativa de compreender o que está ocorrendo estou postando as páginas com os códigos

 

Página com o java:

<!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>
<?php include('../Connections/head_two.php'); 
  
session_start(); // Inicia a session
include "functions.php"; // arquivo de funções.
session_checker(); // chama a função que verifica se a session iniciada da acesso à página.

?>
<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon">

    <script type="text/javascript" src="../scripts/jquery-1.6.min.js"></script>
	<script type="text/javascript">
	$(document).ready(function(){
		$("select[name='nome']").change(function(){
			var snome     = $("input[name='snome']");
			var sobrenome = $("input[name='sobrenome']");
			var cognome   = $("input[name='cognome']");
			var email     = $("input[name='email']");
			
			$( snome )    .val('Carregando...');
			$( sobrenome ).val('Carregando...');
			$( cognome )  .val('Carregando...');
			$( email )    .val('Carregando...');

				$.getJSON(
					'funcao.form.php',
					{ id_funcionario: $( this ).val() },
					function( json )
					{
						$( snome )    .val( json.nome );
						$( sobrenome ).val( json.sobrenome );
						$( cognome )  .val( json.cognome );
						$( email )    .val( json.email );
					}
				);
		});
	});
	</script>

<div id="tudo">
      <div id="tira_cab">
        <div id="tira_um">Pirassununga</div>
        <div id="tira_dois">Ensino Médio</div>
        <div id="tira_tres"> </div>
        <div id="tira_quatro"><?php include('../index/home_dois.php'); ?></div>
        <div id="tira_cinco"><?php include('../index/social_dois.php'); ?></div>
      <!--fim de tira_cab--></div>
      
    <div id="logao"></div>
    <div id="centru_box">
    
        <div class="tarja_box">
	<?php include('index/testa.php'); ?>
		</div>
    
    <div class="grid_7" id="cntradauto">
		
	<div class="contenido2">
	<h2 class=laranja>Conectado a: <?php echo convertem( " ". $_SESSION['nome'] ." ". $_SESSION['sobrenome'] ."!",1);?></h2> 
    </div>	
	
    <?php include('cadastro.usuario.php')?>
    </div>  
    
 </div>

<!--fim do tudo--></div>

<div id="rodape">
<div id="boxrodape">
<div class="textrdp"><?php include('../index/rodape.php'); ?></div>
</div>
</div>

</body>
</html>

Formulario com SQL:

<?php
	include "../Connections/connect.php";
	/**
	 * função que retorna o select
	 */
	function montaSelect()
	{
	$sql = "SELECT*FROM funcionario";
		$query = mysql_query( $sql );

		if( mysql_num_rows( $query ) > 0 )
		{
			while( $dados = mysql_fetch_assoc( $query ) )
			{
				$opt .= '<option value="'.$dados['id_funcionario'].'">'.$dados['nome'].'</option>';
			}
		}
		else
			$opt = '<option value="0">Nenhum funcionario cadastrado</option>';

		return $opt;
	}

	/**
	 * função que devolve em formato JSON os dados do cliente
	 */
    
	function retorna( $id )
	{
		$id = (int)$id;
		

	$sql = "SELECT funcionario.nome, funcionario.sobrenome, funcionario.cognome, contato.email FROM funcionario, contato WHERE funcionario.id_funcionario = {$id} AND contato.id_funcionario = funcionario.id_funcionario"or die (mysql_error());
		$query = mysql_query( $sql );


		$arr = Array();
		if( mysql_num_rows( $query ) )
		{
			while( $dados = mysql_fetch_object( $query ) )
			{
				$arr['snome']      = $dados->nome;
				$arr['sobrenome'] = $dados->sobrenome;
				$arr['cognome']    = $dados->cognome;
				$arr['email']      = $dados->email;
			}
		}
		else
			$arr[] = 'snome: não encontrado';

		return json_encode( $arr );
	}

/* só se for enviado o parâmetro, que devolve o combo */
if( isset($_GET['id_funcionario']) )
{
	echo retorna( $_GET['id_funcionario'] );
}
?>

Página com o formulário

<?php require('../Connections/connect.php');?>
<div id="login">
    <form label class="intexto" name="cadastro" method="post" action="cadastrar.php">
    
    <label> 
    <span class="laranjex">Nome do Funcionário</span>  
		<select name="nome" onchange="" style="text-transform:uppercase;">
        <option value="">Selecione...</option>
        <?php
		include 'funcao.form.php';
	         echo montaSelect();
			?>
		</select>
    
    </label>
    
                <label> 
    <span>Nome</span> 
    <input name="snome" type="text" id="snome" value=" " /><br />
    </label>
       
            <label> 
    <span>Sobrenome</span> 
    <input name="sobrenome" type="text" id="sobrenome" value=" " /><br />
    </label>
    
    <label> 
    <span>Email</span> 
    <input name="email" type="text" id="email"  value=" " /><br />
    </label>
    
            <label> 
    <span>Cognome</span> 
    <input name="cognome" type="text" id="cognome" disabled="disabled" value=" " /><br />
    </label>
    
    <label> 
    <span>Nome de Usuário</span> 
    <input name="usuario" type="text" id="usuario" value=" " /><br />
    </label>
    
    <label> 
    <span>+ informações sobre funcionario</span> 
    <textarea name="info" id="info" rows="10"> </textarea> <br />
    </label>
    
    <label>  
    <input type="submit" class="send" name="Submit" value="Cadastrar" /> <br />
    </label>
     
    </form>
</div>

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Acessa diretamente no seu browser:

 

funcao.form.php?id_funcionario=10

 

oq aparece ?

Compartilhar este post

Link para o post
Compartilhar em outros sites

aw10    0

aw10
Postado

["snome: n\u00e3o encontrado"] - essa é a resposta. Ou seja se não me engano o parâmetro snome não está sendo enviado via get



ou se está sendo enviado não está sendo recebido!

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Não cara, isso quer dizer q vc não tem nenhum cliente com id=10

 

coloque um id válido, e veja.

Compartilhar este post

Link para o post
Compartilhar em outros sites

aw10    0

aw10
Postado

Na verdade o que descobri foi que quando o sobre nome vem com acentuação, por algum motivo ele não é lido.

Se eu cadastrar o funcionário sem nenhum acento o sobre nome é carregado, acentuado não.

Tem alguma ideia do por que?

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Pq json é utf8 por padrão, e só funciona assim.

 

Esteja certo de devolver o teu json com a codificação correta.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito