Ir para conteúdo

Arquivado

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

josenilson

Select dinâmico com 3 campos

Recommended Posts

Pessoal, estou no meio de um desafio e peço a orientação de vocês,   na imagem em anexo esta uma tabela, com 3 campos  preciso do seguinte:

 

quando eu selecionar o primeiro select os dois a frete tem que carregar as informações automática mente,  mas confesso  que não tenho conhecimento de linguagem suficiente para realizar este feito,   no php eu consigo listar no  primeiro  select o primeiro campo da tabela  N_Frota_Cavalo mas como posso deixar isso automático quando selecionar o primeiro os demais filtrar a linha e carregar as demais informações,  consigo isso somente com php ?   

 

muito obrigado. 

 

Sem título.png

Compartilhar este post


Link para o post
Compartilhar em outros sites

Velho, você pode alcançar isto usando javascript e AJAX.. Pra entender, o segundo select precisa saber o que foi selecionado no primeiro e por aí vai.

 

$(this).ready(function(){
  $("#primeiro_select").change(function() { //aqui você pega o primeiro select caso haja mudança e salva numa variavel
    var id_primeiro_select = {"id_primeiro_select" : $('#primeiro_select').val()};


    $.ajax({ //faz a chamada ajax para montar uma query e retornar os dados para o segundo select
      url: "//path/para/sua/funcao",
      dataType: 'json',
      type: 'POST',
      data: id_primeiro_select,

      success: function(data){//caso retorna sucesso, monta o segundo select
        $.each(data, function(i, data){
          $('#segundo_select').append("<option value='"+data.id_segundo_select+"'>"+data.nome_segundo_select+"</option>");
        });
      }

    });
  });
});

 

Na sua função que vai receber os dados enviados do AJAX, tente montar algo parecido:

 

$select = $_POST['id_enviado'];

$query = $this->db->query(" select * from sua_tabela where primeiro_id = '$select' ");

foreach($query->result() as $seu_array){
	$data[] = $seu_array;
}

$json_que_vai_pro_ajax = json_encode($data); //o array precisa ser enviado em json

 

A ideia é mais ou menos essa.

Compartilhar este post


Link para o post
Compartilhar em outros sites
10 horas atrás, VerdenKaf disse:

Velho, você pode alcançar isto usando javascript e AJAX.. Pra entender, o segundo select precisa saber o que foi selecionado no primeiro e por aí vai.

 


$(this).ready(function(){
  $("#primeiro_select").change(function() { //aqui você pega o primeiro select caso haja mudança e salva numa variavel
    var id_primeiro_select = {"id_primeiro_select" : $('#primeiro_select').val()};


    $.ajax({ //faz a chamada ajax para montar uma query e retornar os dados para o segundo select
      url: "//path/para/sua/funcao",
      dataType: 'json',
      type: 'POST',
      data: id_primeiro_select,

      success: function(data){//caso retorna sucesso, monta o segundo select
        $.each(data, function(i, data){
          $('#segundo_select').append("<option value='"+data.id_segundo_select+"'>"+data.nome_segundo_select+"</option>");
        });
      }

    });
  });
});

 

Na sua função que vai receber os dados enviados do AJAX, tente montar algo parecido:

 


$select = $_POST['id_enviado'];

$query = $this->db->query(" select * from sua_tabela where primeiro_id = '$select' ");

foreach($query->result() as $seu_array){
	$data[] = $seu_array;
}

$json_que_vai_pro_ajax = json_encode($data); //o array precisa ser enviado em json

 

A ideia é mais ou menos essa.

Muito obrigado pela ajuda,  não sei se estou fazendo certo , mas uma coisa que aprendi aqui nesse fórum é que não se chega em lugar nenhum chutando alternativas (Faço isso ?) ou (Faço aquilo ) só fazendo chutes e não acertando nada. 

 

Bem mano não quero chutar nada aqui , mas confesso que  AJAX pra mim esta sendo novo, então o que entendi foi mais ou menos isso que esta listando abaixo, a nível de aprendizado poderia me corrigir e me dizer no que estou errando,  uma duvida essa parta aqui url : "placa.php",      tem que ser um aquivo .php ou .js  ?

 

ate o momento só esta funcionando mesmo o primeiro select onde listo o primeiro campo da tabela. 

 

esses são os arquivos. 

 

<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>teste combo </title>
		<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>

		<script type="javascript">
			$(this).ready(function() {
				$("#frota").change(function() {//aqui você pega o primeiro select caso haja mudança e salva numa variavel
					var frota = {
						"idFrota_Cavalo" : $('#frota').val()
					};

					$.ajax({//faz a chamada ajax para montar uma query e retornar os dados para o segundo select
						url : "placa.php",
						dataType : 'json',
						type : 'POST',
						data : idFrota_Cavalo,

						success : function(data) {//caso retorna sucesso, monta o segundo select
							$.each(data, function(i, data) {
								$('#placa').append("<option value='" + data.idFrota_Cavalo + "'>" + data.Placa_Cavalo + "</option>");
							});
						}
					});
				});
			});
		</script>

	</head>

	<body>

		<table>
			<form name="" action="" method="">

				<select id="frota" name="frota" >
					<option value=""> Selecione a Frota </option>

					<?php
					include "conexao.php";
					$busca = 'SELECT * FROM `frota_cavalo` ';
					$result = $db -> query($busca, PDO::FETCH_ASSOC) or die("erro");
					foreach ($result as $row) {
						echo '<option value=' . $row['N_Frota_Cavalo'] . '>' . $row['N_Frota_Cavalo'] . '</option>';

					}
					?>
				</select>
				</div>

				<select  name="placa" id= "placa">

				</select>

				<select  name="motorista" id= "motorista">

				</select>

				</td>

				</tr>

				<button type="submit" name="cadastro" class="btn btn-success">
					Cadastrar
				</button>

			</form>
		</table>
	</body>

</html>

abaixo o placa.php

 



<?php 
include "conexao.php";
$select = $_POST['id_enviado'];

$query = $this->db->query(" select * from frota_cavalo where idFrota_Cavalo = '$select' ");

foreach($query->result() as $seu_array){
	$data[] = $seu_array;
}

$json_que_vai_pro_ajax = json_encode($data); //o array precisa ser enviado em json

?>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

  • Conteúdo Similar

    • Por josenilson
      Olá pessoal, 
       
      Nesse Script abaixo estou fazendo  o seguinte: 
       
      Ao selecionar algo no primeiro select id"frota" o segundo select id"placa" ativa e lista a placa e por ultimo ao selecionar a placa o select motorista lista o motorista . 
       
      O que  preciso porem estou limitado ate aqui,  é o seguinte:
       
      Quando o primeiro select id"frota" for selecionado o segundo select id"placa" tem que trazer  a placa daquela  frota  na sua respectiva linha da tabela,  assim sucessivamente quando selecionar a placa o terceiro select vai trazer o motorista daquela respectiva linha. 
       
      Ou seja, ao final quando o usuário selecionar o primeiro select id "frota" os demais  placa/motorista vão ser preenchidos dinamicamente de acordo com a frota.
       
      Outro detalhe é que se observarem os select placa/motorista estão com os Options  inseridos manualmente, digo não sei listar isso vindo direto da tabela através  do php.
       
      Desde já agradeço a todos.
      <?php include "conexao.php"; ?> <!DOCTYPE html> <html> <head> <title>TESTE DE COMBO </title> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="js/jquery-2.1.1.min.js"></script> </head> <script type="text/javascript"> $(document).ready(function(){ /* Faz a condição do primeiro select */ $("#frota").change(function(){ var frota = $(this).val(); if(frota != ""){ $("#placa").html(''); //limpa o segundo select para os novos options $("#placa").append('<option>PLACA</option>'); $("#placa").append('<option>JRP6212</option>'); } }) /* Faz a condição do segundo select */ $("#placa").change(function(){ var placa = $(this).val(); if(placa != ""){ $("#motorista").html(''); //limpa o terceiro select para os novos options $("#motorista").append('<option>MOTORISTA</option>'); $("#motorista").append('<option>JOSENILSON</option>'); } }) }) </script> <body> <label>Selecione a frota </label> <select id="frota"> <option value="" name"motorista"> FROTA <?php $busca = 'SELECT * FROM motorista '; $result = $db->query($busca, PDO::FETCH_ASSOC) or die("erro ao conectar"); foreach ($result as $row){ echo '<option value='.$row['idmotorista'].'>'.$row['frota'].'</option>'; } ?> </option> </select> <br><br> <select id="placa"> </select> <br><br> <select id="motorista"> </select> </body> </html> conexão 
      <?php $dsn = 'mysql:host=localhost;dbname=teste;charset=utf8'; $username = 'root'; $password = ''; $db = new PDO($dsn, $username, $password); if(!$db){ echo "erro ao conectar "; } ?> tabela 
      CREATE TABLE `teste`.`frota` ( `idfrota` INT NOT NULL AUTO_INCREMENT , `frota` VARCHAR(10) NOT NULL , `placa` VARCHAR(10) NOT NULL , `motorista` VARCHAR(10) NOT NULL , PRIMARY KEY (`idfrota`)) ENGINE = MyISAM Em anexo consta os arquivos, desde já agradeço.
      index.php
      conexao.php
    • Por josenilson
      Olá pessoal, 
       
      Nesse Script abaixo estou fazendo  o seguinte: 
       
      Ao selecionar algo no primeiro select id"frota" o segundo select id"placa" ativa e lista a placa e por ultimo ao selecionar a placa o select motorista lista o motorista . 
       
      O que  preciso porem estou limitado ate aqui,  é o seguinte:
       
      Quando o primeiro select id"frota" for selecionado o segundo select id"placa" tem que trazer  a placa daquela  frota  na sua respectiva linha da tabela,  assim sucessivamente quando selecionar a placa o terceiro select vai trazer o motorista daquela respectiva linha. 
       
      Ou seja, ao final quando o usuário selecionar o primeiro select id "frota" os demais  placa/motorista vão ser preenchidos dinamicamente de acordo com a frota.
       
      Outro detalhe é que se observarem os select placa/motorista estão com os Options  inseridos manualmente, digo não sei listar isso vindo direto da tabela através  do php.
       
      Desde já agradeço a todos.
       
      <?php include "conexao.php"; ?> <!DOCTYPE html> <html> <head> <title>TESTE DE COMBO </title> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="js/jquery-2.1.1.min.js"></script> </head> <script type="text/javascript"> $(document).ready(function(){ /* Faz a condição do primeiro select */ $("#frota").change(function(){ var frota = $(this).val(); if(frota != ""){ $("#placa").html(''); //limpa o segundo select para os novos options $("#placa").append('<option>PLACA</option>'); $("#placa").append('<option>JRP6212</option>'); } }) /* Faz a condição do segundo select */ $("#placa").change(function(){ var placa = $(this).val(); if(placa != ""){ $("#motorista").html(''); //limpa o terceiro select para os novos options $("#motorista").append('<option>MOTORISTA</option>'); $("#motorista").append('<option>JOSENILSON</option>'); } }) }) </script> <body> <label>Selecione a frota </label> <select id="frota"> <option value="" name"motorista"> FROTA <?php $busca = 'SELECT * FROM motorista '; $result = $db->query($busca, PDO::FETCH_ASSOC) or die("erro ao conectar"); foreach ($result as $row){ echo '<option value='.$row['idmotorista'].'>'.$row['frota'].'</option>'; } ?> </option> </select> <br><br> <select id="placa"> </select> <br><br> <select id="motorista"> </select> </body> </html> script de conexão. 
       
      <?php $dsn = 'mysql:host=localhost;dbname=teste;charset=utf8'; $username = 'root'; $password = ''; $db = new PDO($dsn, $username, $password); if(!$db){ echo "erro ao conectar "; } ?> script da tabela . 
       
      CREATE TABLE `teste`.`frota` ( `idfrota` INT NOT NULL AUTO_INCREMENT , `frota` VARCHAR(10) NOT NULL , `placa` VARCHAR(10) NOT NULL , `motorista` VARCHAR(10) NOT NULL , PRIMARY KEY (`idfrota`)) ENGINE = MyISAM  
      index.php
      conexao.php
×

Informação importante

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