Ir para conteúdo

Arquivado

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

fgml

Select2 - Preencher automaticamente campos do formulário

Recommended Posts

Bom dia, estou criando um formulário que possui um campo que o usuário irá digitar o nome da empresa e o select2 irá realizar uma busca no BD e retornar o nome da empresa para o campo, exemplo na imagem abaixo:

 

zYVFHlv.jpg

 

Script no HTML:

<script language="JavaScript" type="text/javascript">
		
	    $(document).ready(function() {	
          $('#nome_pj').select2({
			placeholder: "Digite o nome da empresa",
		    ajax: {        	
		        url: 'autosuggest_busca_pessoajuridica.php',
		        dataType: 'json',
		        quietMillis: 50,
		        data: function (term) {
		            return {
		                term: term
		            };
		        },
		        results: function (data) {
		            var results = [];		            
		            $.each(data, function(index, item){
		                results.push({
		            	  	text: item.nome_pj,
		           	    	id: item.nome_pj
		                });
		            });
		            return {results: results};
		        }
		      }
		   });
	     });
	
</script>

Código do select2 (autosuggest_busca_pessoajuridica.php) para realizar a busca no BD:

<?php

	include("lib/config.php");
	include("lib/util.php");

	$con = mysqli_connect(DB_HOST,DB_USER,DB_PASSWORD,DB_NAME) or die("Error " . mysqli_error($con));

	function destacaTexto($highlite,$string){
		return str_ireplace($highlite,"<b>".$highlite."</b>",$string);
	}

	//Para a busca do auto completar
	$input  = (isset($_GET['term']))? htmlspecialchars($_GET['term']) :null;

    $input = utf8_decode($input);

	if ($input!=''){
	$data = array();
	
	function toUtf8(&$item, $key) {
		$item = iconv("iso-8859-1","utf-8",$item);
	}
	
	$query = "SELECT id_feap_pj, tipo_pj, cnpj, nome_pj, endereco_pj, num_end_pj, compl_end_pj, bairro_end_pj, cep_pj, id_mun, uf_pj, telefone_pj, email_pj, nome_representante_pj, cpf_representante_pj, data_cadastro_pj, data_alteracao_pj, id_user 
			  FROM feap_pj
			  WHERE nome_pj LIKE '%$input%' ";

	$result = $con->query($query);	
	
	while($row = mysqli_fetch_array($result)) {

		array_walk($row, 'toUtf8');
		
		extract($row);
	
		$json = array();
		$json['id_feap_pj'] = $id_feap_pj;
		$json['tipo_pj'] = $tipo_pj;
		$json['cnpj'] = $cnpj;
		$json['nome_pj'] = $nome_pj;
		$json['endereco_pj'] = $endereco_pj;
		$json['num_end_pj'] = $num_end_pj;
		$json['compl_end_pj'] = $compl_end_pj;
		$json['bairro_end_pj'] = $bairro_end_pj;
		$json['cep_pj'] = $cep_pj;
		$json['id_mun'] = $id_mun;
		$json['uf_pj'] = $uf_pj;
		$json['telefone_pj'] = $telefone_pj;
		$json['email_pj'] = $email_pj;
		$data[] = $json;
	}

	header("Content-type: application/json");
	echo json_encode($data);
    }

    ?> 
O select2 funciona normalmente e consegue fazer a busca no BD para retornar o nome da empresa.
Eu gostaria que assim que eu selecionar o nome da empresa, todas as outras informações sejam preenchidas automaticamente, com base nos valores contidos no BD e retorne nos campos do formulário. Como faço isso ?
Agradeço a ajuda desde já.

Compartilhar este post


Link para o post
Compartilhar em outros sites

eu faço isso aqui

 

$('#cb-pessoas').select2({
        placeholder : "Selecione uma pessoa",
        minimumInputLength: 3,
        ajax: {
            url: "/acmanager",
            dataType: 'json',
            quietMillis: 250,//intervalo entre os botoes, 100ms que é o default fica pouco
            data: function (term, page) { // page is the one-based page number tracked by Select2, wich i dont use anyways
                return {
                    action : 'pessoas_quick_search',
                    term: term, //search term
                };
            },
            results: function (data, page) {
                // notice we return the value of more so Select2 knows if more results can be loaded
                return {results: data.response};
            }
        },
        formatResult: function(r){
            var item = $("<div class='sr-item' ref='"+r.id+"' pid='"+r.id+"'></div>");
            var title = $("<span>"+r.id+" - "+r.nome+" - S.U.S: "+r.cartaosus+"</span><br/>");
            var desc = $("<small>"+r.endereco+", "+r.bairro+" - "+r.cidade+"</small>");
            item.append(title);
            item.append(desc);
            return item;
        },
        formatSelection: function(r){ return r.nome;  },
        escapeMarkup: function (m) { return m; },
        dropdownCssClass: "bigdrop"
    }).change(function(e){

        selectPessoa(e.added);

    });

repara o .change bem no final, aquele e contém todos os dados da opcao selecionada

nesse caso ali o e.added.id é o id da pessoa selecionada, e eu faço outra requisicao ajax pra pegar as outras informacoes q eu quero

Compartilhar este post


Link para o post
Compartilhar em outros sites

é uma array json, nada de mais, vou postar aqui mas n vai ajudar mto

 
<?php

$term = $this->_helper->request('term');
$uid = base64_decode($this->_session->usession);

Zend_Loader::loadClass('systemusuarios');
$users = new systemusuarios;

$user = $users->fetchRow("id=$uid");

if(strlen($term) > 2)
{

    $sql = "SELECT todos.* FROM ((
    SELECT
        a.id,
        a.nome,
        a.cpf,
        a.cartaosus,
        a.datanasc,
        a.endereco,
        a.bairro,
        c.nome AS cidade
    FROM pessoas a
    INNER JOIN cidades c ON c.id = a.cidade
    WHERE ".
        ($this->_helper->request('c') == 1 ? "c.id = ".$user->cidade." and ": null).
        " (a.nome LIKE '$term%')
        AND a.trash = 0
        AND a.enabled = 1
    ORDER BY a.nome ASC
    LIMIT 7)
    UNION ALL
    (
    SELECT
        a.id,
        a.nome,
        a.cpf,
        a.cartaosus,
        a.datanasc,
        a.endereco,
        a.bairro,
        c.nome AS cidade
    FROM pessoas a
    INNER JOIN cidades c ON c.id = a.cidade
    WHERE ".
        ($this->_helper->request('c') == 1 ? "c.id = ".$user->cidade." and ": null).
        " ((a.nome LIKE '%$term%' AND a.nome NOT LIKE '$term%') OR a.cartaosus LIKE '%$term%' OR a.cpf LIKE '%$term%')
        AND a.trash = 0
        AND a.enabled = 1
    ORDER BY a.nome ASC
    LIMIT 7
    )) AS todos
    LIMIT 7
    ";
    try
    {

        $r['response'] = $this->_db->fetchAll($sql);

    } catch (Excpetion $e)
    {

        $r['error'] = $e->getMessage();

    }


} else {
    $r['error'] = $this->_helper->error->getStr(18);
}

echo Zend_Json::encode($r);

EDIT: note que essa parte é exclusiva para a busca, depois que a pessoa clica em um resultado, dai eu faço outra requisição para pegar as demais informações, assim a query n fica pesada d+

Compartilhar este post


Link para o post
Compartilhar em outros sites

Veja se é isso:


<script>
window.onload = function()
{
	document.getElementById("empresa").onkeypress = function()
	{
		//faz um select no banco: "SELECT *FROM empresas WHERE empresa LIKE '".$value."'"
		//O resultado tem que ser uma lista de options
		var xHttp = new XMLHttpRequest();
		xHttp.open("GET", "/pagina.php?query="+this.value, false);
		xHttp.send(null);
		//var options = xHttp.responseText;

		//Tendo a lista é só adicionar no datalist
		var options = '<option value="empresa4">empresa4</option>'+
		'<option value="empresa5">empresa5</option>'+
		'<option value="empresa6">empresa6</option>';

		document.getElementById("empresas").innerHTML = options;
	}
}
</script>
<input type="text" name="empresa" id="empresa" list="empresas"/>

<datalist id="empresas">
	<option value="empresa1">empresa1</option>
	<option value="empresa2">empresa2</option>
	<option value="empresa3">empresa3</option>
</datalist>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Obrigado a todos que colaboraram.

Acabei elaborando uma saída aqui pelo modo bruto gambiarra:

<script language="JavaScript" type="text/javascript">

	//Preenchimento automatico depois de selecionado no autocompletar do campo nome	
	$(document).ready(function() {
		
		//Autocompletar para seleção de nome dos clientes
		$('#nome_pj').select2({
			
			placeholder: "Digite o nome do produtor rural",
		    ajax: {        	
		        url: 'autosuggest_busca_pessoajuridica.php',
		        dataType: 'json',
		        quietMillis: 50,
		        data: function (term) {
		            return {
		                term: term
		            };
		        },
		        results: function (data) {
		            var results = [];		            
		            $.each(data, function(index, item){
		                results.push({
		            	  	text: item.nome_pj,
		           	    	id: item.nome_pj,
		           	    	cnpj: item.cnpj,
		           	    	endereco_pj: item.endereco_pj,
		           	    	num_end_pj: item.num_end_pj,
		           	    	compl_end_pj: item.compl_end_pj,
		           	    	bairro_end_pj: item.bairro_end_pj,
		           	    	cep_pj: item.cep_pj,
		           	    	id_mun: item.municipio,
		           	    	uf_pj: item.estado,
		           	    	telefone_pj: item.telefone_pj,
		           	    	email_pj: item.email_pj,
		           	    	nome_representante_pj: item.nome_representante_pj,
		           	    	cpf_representante_pj: item.cpf_representante_pj

		                });
		            });		            
		            return {results: results};
		        }
		    },
		}).on("change", preencheFormulario); 
		
		function preencheFormulario(el) {		    
		    var data = $(el.target).select2('data');
		    var cnpj = data.cnpj;
		    var cnpjInput = document.getElementById('cnpj');
		    cnpjInput.value = cnpj;
		    var endereco_pj = data.endereco_pj;		    
		    var enderecopjInput = document.getElementById('endereco_pj');
		    enderecopjInput.value = endereco_pj;
		    var num_end_pj = data.num_end_pj;
		    var numendpjInput = document.getElementById('num_end_pj');
		    numendpjInput.value = num_end_pj;
		    var compl_end_pj = data.compl_end_pj;
		    var complendpjInput = document.getElementById('compl_end_pj');
		    complendpjInput.value = compl_end_pj;
		    var bairro_end_pj = data.bairro_end_pj;
		    var bairroendpjInput = document.getElementById('bairro_end_pj');
		    bairroendpjInput.value = bairro_end_pj;
		    var cep_pj = data.cep_pj;
		    var ceppjInput = document.getElementById('cep_pj');
		    ceppjInput.value = cep_pj;
		    var id_mun = data.id_mun;
		    var idmunInput = document.getElementById('id_mun');
		    idmunInput.value = id_mun;
		    var uf_pj = data.uf_pj;
		    var ufpjInput = document.getElementById('uf_pj');
		    ufpjInput.value = uf_pj; 
		    var telefone_pj = data.telefone_pj;
		    var telefonepjInput = document.getElementById('telefone_pj');
		    telefonepjInput.value = telefone_pj;
		    var email_pj = data.email_pj;
		    var emailpjInput = document.getElementById('email_pj');
		    emailpjInput.value = email_pj;
		    var nome_representante_pj = data.nome_representante_pj;
		    var nomerepresentantepjInput = document.getElementById('nome_representante_pj');
		    nomerepresentantepjInput.value = nome_representante_pj;
		    var cpf_representante_pj = data.cpf_representante_pj;
		    var cpfrepresentantepjInput = document.getElementById('cpf_representante_pj');
		    cpfrepresentantepjInput.value = cpf_representante_pj;
		}   
	});
	
</script>

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.