JQuery.autocompletar na JSP

7 de janeiro de 2011 10 respostas

alexwebsp 7 de janeiro de 2011

Estou tentando fazer o autocompletar numa tsxtfield, consegui fazer funcionar em partes tenho a minha jsp principal e uma getdata.jsp onde ela paga os dados do banco de dados, só que quando lista os dados aparece junto os aracretes : [ ] , do array e a acentuação fica tudo esquisito, também queria enviar para o getdata aquilo que for digitado e no getdata usar o Select com o LIKE e retornar os valores numa lista para o principal.jsp, veja o meu código:

getdata.jsp

<%
String sql="";
Connection dbCon;
List<String> array = new ArrayList();

//String query = request.getParameter("nomecdp");
try {
Class.forName("org.postgresql.Driver");
String a = "jdbc:postgresql://localhost:5432/cdpforum";
dbCon = DriverManager.getConnection(a, "Usuario", "senha");
java.sql.Statement s = dbCon.createStatement();
//sql = " select cdpnome from cdp where LIKE cdpnome='"+query+"%'";
sql = " select cdpnome from cdp";
ResultSet rs = s.executeQuery(sql);

    while(rs.next())
        {
        array.add(rs.getString("cdpnome");+ "\n");
        }
        rs.close();
        s.close();

        } catch (ClassNotFoundException e) {
            System.out.println("Erro de configuracao" + e.getException());
        } catch (SQLException sqle) {
            System.out.println("Erro de SQL:" + sqle.getMessage() + " - " + sql);
        }
        response.getWriter().println(array); 
%>

principal.jsp


<script type="text/javascript">

		$(document).ready(function(){				
                    $("#nomecdp").autocomplete("getdata.jsp", {
                                width: 380,
                                selectFirst: true

                            });
		});
	</script>

10 Respostas

douglaskd 7 de jan. de 2011

você tem que converter o array em string antes de imprimi-lo no jsp.

essa query: " select cdpnome from cdp where LIKE cdpnome=’"+query+"%’"

acho que o correto é mais ou menos isso: " select cdpnome from cdp where cdpnome LIKE '"+query+"%'"

não testei, to tentando deduzir isso.

alexwebsp 7 de jan. de 2011

douglaskd

arrumei desta forma :

String sql="";
Connection dbCon;
String valores = "";
try {
Class.forName("org.postgresql.Driver");
String a = "jdbc:postgresql://localhost:5432/cdpforum";
dbCon = DriverManager.getConnection(a, "Alex", "mattos");
java.sql.Statement s = dbCon.createStatement();
sql = " select cdpnome from cdp";
ResultSet rs = s.executeQuery(sql);

    while(rs.next())
	{
        String nome = rs.getString("cdpnome").toString();
        valores += nome+ "\n";
        }
        rs.close();
        s.close();

        } catch (ClassNotFoundException e) {
            System.out.println("Erro de configuracao" + e.getException());
        } catch (SQLException sqle) {
            System.out.println("Erro de SQL:" + sqle.getMessage() + " - " + sql);
        }
        response.getWriter().println(valores);

Deu certo, mas ainda os caracteres com acentuação fica aparecendo pequenos quadrados no lugar.

Obrigado !

douglaskd 7 de jan. de 2011

deve ser o charset

tenta colocar assim no topo da página:

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

alexwebsp 7 de jan. de 2011

Fiz da forma que vc postou mas não deu certo !

douglaskd 7 de jan. de 2011

acho que é no banco…você cadastrou esses dados manualmente?

no banco de dados a tabela esta como utf-8 ou Latin ?

alexwebsp 7 de jan. de 2011

UTF-8

alexwebsp 11 de jan. de 2011

conseguir resolver a questão dos caracteres coloquei assim:

<%@page contentType="text/html"  pageEncoding="UTF-8" language = "java"%>

referente ao banco de dados minha classe ficou assim :

String sql="";
Connection dbCon;
String valores = "";

String query = request.getParameter("q");

String nome="";
try {
Class.forName("org.postgresql.Driver");
String a = "jdbc:postgresql://localhost:5432/cdpforum";
dbCon = DriverManager.getConnection(a, "Usuario", "senha");
java.sql.Statement s = dbCon.createStatement();
sql = " select nome from cdp where nome ilike '%"+query+"%'";
ResultSet rs = s.executeQuery(sql);


   while(rs.next())
	{
        valores += rs.getString("nome").toString();
        valores += nome+ "\n";   
        }
        rs.close();
        s.close();

        } catch (ClassNotFoundException e) {
            System.out.println("Erro de configuracao" + e.getException());
        } catch (SQLException sqle) {
            System.out.println("Erro de SQL:" + sqle.getMessage() + " - " + sql);
        }
        response.getWriter().println(valores);

só que tem mais problema:

Exemplo: se eu digitar a letra “a” só aparece para mim 10 opções mas se eu fizer uma pesquisa com a mesma query no banco de dados, me volta 30 registros, se eu não colocar “\n” me retorna os 30 registros sem pular linha, mas se colocar “\n” pula linha mas só me aparece 10 registros. Por favor me ajude ! Obrigado !

douglaskd 11 de jan. de 2011

tenta usar + " " ao invés do + “/n”

alexwebsp 18 de jan. de 2011

Vou postar a solução se alguém se alguém precisar:

getdata.jsp

String sql="";   
Connection dbCon;   
String valores = "";   
try {   
Class.forName("org.postgresql.Driver");   
String a = "jdbc:postgresql://localhost:5432/bancodedados";   
dbCon = DriverManager.getConnection(a, "Usuario", "senha");   
java.sql.Statement s = dbCon.createStatement();   
sql = " select nome from usuario";   
ResultSet rs = s.executeQuery(sql);   
  
    while(rs.next())   
    {   
        String nome = rs.getString("nome").toString();   
        valores += nome+ "\n";   
        }   
        rs.close();   
        s.close();   
  
        } catch (ClassNotFoundException e) {   
            System.out.println("Erro de configuracao" + e.getException());   
        } catch (SQLException sqle) {   
            System.out.println("Erro de SQL:" + sqle.getMessage() + " - " + sql);   
        }   
        response.getWriter().println(valores);

<script type="text/javascript">

		$(document).ready(function(){
                    $("#nome").autocomplete("getdata.jsp", {
                                                            
                                scroll: true,
                                scrollHeight: 10,
                                maxHeight: 10,
                                width: 280,
                                selectFirst: true
                            });
		});
	</script>

e no jquery.autocomplete.css:

.ac_results {
	padding: 0px;
	border: 1px solid black;
	background-color: white;	
	z-index: 99999;
	maxHeight: 200;
	height: 200px;
	overflow-y: scroll; 
	overflow-x: hidden;
}

amauri.furtado 14 de jul. de 2012

Boa Tarde alexwebsp,

será que vc ainda tem esse código fonte completo para que nós iniciante possamos ver e testar ?

Seria mt bom se vc disponibilizase esses arquivos.

Att,
Amauri Furtado

Criado 7 de janeiro de 2011

Ultima resposta 14 de jul. de 2012

Respostas 10

Participantes 3

10 Respostas

Topicos relacionados