Ir para conteúdo
Fórum Script Brasil
  • 0

autocomplete em campo de texto


Carlos Rocha

Pergunta

Estou usando um script para completar um input type="text".

// JavaScript Document    

//fruits = new Array('cleber','mamao','melancia','mercadoria','marmelada');
//names = new Array('tom','dick','harry','john','petter','foo','bar');

function autocomplete(n,ac_array){

if (n.value == "") return 0;
if (event.keyCode == 8 && n.backspace){
n.value = n.value.substr(0,n.value.length-1);
n.backspace = false;
}

var r = n.createTextRange();
tmp= n.value;
if (tmp == "")return 0;
for (z=0;z<ac_array.length;z++){
tmp2 = ac_array[z];
count = 0;
for (i = 0;i<tmp.length;i++){
if (tmp2.charAt(i) == tmp.charAt(i)){
count++
}
}
if (count == tmp.length){
diff = tmp2.length - tmp.length;
if (diff <= 0) break;
kap = "";
for (i=0;i<tmp2.length;i++){
if (i >= tmp.length) kap += tmp2.charAt(i);
}
n.backspace = true;
r.text += kap;
r.findText(kap,diff*-2);
r.select();
return 0;
}
}
n.backspace = false;
return 0;
}
Estou chamando a função autocomplete assim:
<input type="text" id="text_bairro" value="" backspace='false' onkeyup="autocomplete(this,<?php $cidades_nomes; ?>)"  /><br />
Esse array, se impresso com print_r(), exibe assim:
Array
(
    [0] => Eugenopolis
    [1] => Muriaé
    [2] => São Paulo
)
Mas, o script só esta aceitando arra nesse formato:
fruits = new Array('cleber','mamao','melancia','mercadoria','marmelada');
  names = new Array('tom','dick','harry','john','petter','foo','bar');

O que fazer nesse caso?

Editado por Carlos Rocha
Link para o comentário
Compartilhar em outros sites

5 respostass a esta questão

Posts Recomendados

  • 0

certo, então me diz apenas como posso imprimir a array $cidades_nomes com este aspecto;

'Eugenopolis','Muriaé','São Paulo'
Em vez de este:
Array
(        
   [0] => Eugenopolis       
   [1] => Muriaé        
   [2] => São Paulo
)
? A ideia aqui é fazer:
<input type="text" id="text_bairro" value="" backspace='false'  onkeyup="autocomplete(this,new Array(<?php echo $cidades_nomes; ?>))"  />

Link para o comentário
Compartilhar em outros sites

  • 0

Seguinte:

Tenho o campo texto no formulario(form);

<input type="text" id="text_bairro" value="" backspace='false' onkeyup="autocomplete(this,<?php $cidades_nomes; ?>)"  /><
Tenho o array php que, dando um print_r() nele, exibe:
Array
(           
   [0] => Eugenopolis          
   [1] => Muriaé           
   [2] => São Paulo
)
[code]
Eu quero que, a medida que o usuario for digitando o nome de cidade no campo texto do form, vá sendo feita uma busca no array php e autocompletando o nome da cidade caso haja alguma iniciando com o que o usuario digitar
Só que isso só é possivel com JavaScript.
Daí, estou usando a função abaixo para fazer esse serviço. Porem se observar as primeiras linhas comentadas, essa função requer que o array seja da forma new array e o php retorna array.
Então, na hora de chamar a função tive a ideia de chamar criando o new array do Js e dentro dele, preciso arranjar uma forma de imprimir o array php da forma abaixo:
[code]
'Eugenopolis','Muriaé','São Paulo'
função autocomplete
// JavaScript Document    

//fruits = new Array('cleber','mamao','melancia','mercadoria','marmelada');
//names = new Array('tom','dick','harry','john','petter','foo','bar');

function autocomplete(n,ac_array){

if (n.value == "") return 0;
if (event.keyCode == 8 && n.backspace){
n.value = n.value.substr(0,n.value.length-1);
n.backspace = false;
}

var r = n.createTextRange();
tmp= n.value;
if (tmp == "")return 0;
for (z=0;z<ac_array.length;z++){
tmp2 = ac_array[z];
count = 0;
for (i = 0;i<tmp.length;i++){
if (tmp2.charAt(i) == tmp.charAt(i)){
count++
}
}
if (count == tmp.length){
diff = tmp2.length - tmp.length;
if (diff <= 0) break;
kap = "";
for (i=0;i<tmp2.length;i++){
if (i >= tmp.length) kap += tmp2.charAt(i);
}
n.backspace = true;
r.text += kap;
r.findText(kap,diff*-2);
r.select();
return 0;
}
}
n.backspace = false;
return 0;
}
Consegue com o implode:
onkeyup="autocomplete(this,new Array(<?php echo implode(',',$cidades_nomes); ?>))"
mas acontece, as cidadesa estão sendo exibidas assim:
new Array(Eugenopolis,Muriaé,São Paulo)
E eu preciso assim:
new Array('Eugenopolis','Muriaé','São Paulo')

Link para o comentário
Compartilhar em outros sites

  • 0

Bom, consegui com o php assim:

<?php
               $cidades_nomes_js="";
              foreach ($cidades_nomes as $nome)
             {
                 if ($nome == $cidades_nomes[count($cidades_nomes)-1])
                 {
                      $cidades_nomes_js.="'".$nome."'";
                 }
                 else 
                 {
                      $cidades_nomes_js.="'".$nome."',";
                 }
             }
         ?>
Acontece que a função autocomplete do JavaScript é case sensitive. Ou seja, se o usuario digitar mur, e no array tiver Muriaé, a busca não vai achar nada. Como eu faço para a busca não ser case sensitive? Segue novamente a função:
<script>
/*fruits = new Array('São Paulo','mamao','melancia','mercadoria','marmelada');
names = new Array('tom','dick','harry','john','petter','foo','bar');
*/function autocomplete(n,ac_array){
if (n.value == "") return 0;
if (event.keyCode == 8 && n.backspace){
n.value = n.value.substr(0,n.value.length-1);
n.backspace = false;
}

var r = n.createTextRange();
tmp= n.value;
if (tmp == "")return 0;
for (z=0;z<ac_array.length;z++){
tmp2 = ac_array[z];
count = 0;
for (i = 0;i<tmp.length;i++){
if (tmp2.charAt(i) == tmp.charAt(i)){
count++
}
}
if (count == tmp.length){
diff = tmp2.length - tmp.length;
if (diff <= 0) break;
kap = "";
for (i=0;i<tmp2.length;i++){
if (i >= tmp.length) kap += tmp2.charAt(i);
}
n.backspace = true;
r.text += kap;
r.findText(kap,diff*-2);
r.select();
return 0;
}
}
n.backspace = false;
return 0;
}
</script>

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.



  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...