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

Digitar código e trazer descrição sem refresh


*Michelle*

Pergunta

Olá pessoal,

Preciso de ajuda.

Tenho um formulário de oçamento em jsp e estou precisando que ao digitar o código do produto sejam exibidos a descrição e o preço que estão cadastrados no banco sem dar refresh na página para não perder os outros itens que já incluí no grid.

Todos os campos (código, descrição e preço) são text.

Eu estava pensando em ter um botão ao lado do código para ser acionado e trazer a descrição e o preço. Ou se puder, colocar automático através do onBlur (quando o cara apertar o tab já trazer tudo).

Me disseram que isso tem que ser através do Ajax mas como sou nova nessa área ainda estou perdida em como fazer!

Se alguém puder me ajudar, agradecerei eternamente. =]

Abraços,

Michelle

Link para o comentário
Compartilhar em outros sites

5 respostass a esta questão

Posts Recomendados

  • 0

Isso ae ajax.

O que ele vai fazer?

você vai colocar um evento no seu campo, tipo: onClick, onBlur, onKeyUp, etc...

Ao disparar o evento irá charmar uma função, essa irá mandar os parâmetros(informações dos campos) para para um arquivo no servidor, pode mandar via POST ou GET.

O programa no ser no servidor retornará com o resultado, o javascript vai pegar pegar a resposta e por na página.

Link para o comentário
Compartilhar em outros sites

  • 0

Eu achei esse exemplo aqui muito parecido com o que quero, mas preciso saber como faço pra buscar do banco, já que no exemplo ele exibe os dados que informei no JSP:

index.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>Customer ID to First and Last Name using XmlHttpRequest</title>
  &lt;script language="javascript" type="text/javascript">

var url = "getCustomerInfo.jsp?customerID="; // The server-side script
var http = getHTTPObject(); // We create the XMLHTTPRequest Object

function handleHttpResponse() {
    if (http.readyState == 4) {
        if (http.status == 200) {
                    alert("In HandleHTTPResponse");

                    var message = http.responseXML.getElementsByTagName("message")[0];
                    //alert(message.tagName);                    
                    results = message.childNodes[0].nodeValue.split(",");
                    document.getElementById('firstname').value = results[0];
                    document.getElementById('lastname').value = results[1];
                } else {
                    alert ( "Not able to retrieve name" );
                }
    }    
}

function updateFirstLastName() {
        alert("In updateFirstNameLastName");
        
        var customerIDValue = document.getElementById("customerID").value;
    http.open("GET", url + escape(customerIDValue), true);
    http.onreadystatechange = handleHttpResponse;
    http.send(null);
}

function getHTTPObject() {
    var xmlhttp;
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    } return xmlhttp;
}
</script>

</head>
<body>
<form action="post">
  <p>Customer ID:
  <input size="10" name="customer ID" id="customerID" type="text" onblur="updateFirstLastName();"></p>
  First Name:
  <input size="10" name="First Name" id="firstname" type="text">Last Name:
  <input size="10" name="Last Name" id="lastname" type="text"></form>
</body>
</html>
getCustomerInfo.jsp
<%
String customerID = request.getParameter("customerID");
if(customerID != null) {
        //System.out.println("before sending response");
    response.setContentType("text/xml");
    response.setHeader("Cache-Control", "no-cache");
           
        // for XML formatted message:
    response.getWriter().write("<message>Michelle,Doe</message>");    
        //System.out.println("after sending response");    
} else {
    //nothing to show
    response.setStatus(HttpServletResponse.SC_NO_CONTENT);
}
%>

Em response.getWriter().write("<message>Michelle,Doe</message>"); eu informo o que quero que seja preenchido nos campos, mas na verdade eu preciso que isso ele busque do banco, da tabela do produto.

Agora, como que faço pra buscar? Tem que ser pelo Controle, Dao.. ou por aí mesmo ??

Expliquei ou confundi ainda mais?? rsrsrs

Mi

Link para o comentário
Compartilhar em outros sites

  • 0

você irá precisar preparar seu jsp para acessar o banco, ele precisa pegar parte da sua informação e fazer uma pergunta(query) pro banco.

no php eu faria assim.

$id=$_GET['campo'];

$mssql_user="sql";
$mssql_pass="sql";
$banco="teste";
$sql=mssql_connect(".\SQL",$mssql_user, $mssql_pass);
$sql=mssql_select_db($banco, $sql);
$sql=mssql_query("SELECT name FROM login WHERE id = $id");
$result=mssql_fetch_array($sql);

echo $result['name'];

No seu caso, falta acessar o banco e fazer a consulta com o valor passado pelo ajax.

Editado por Prototype
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.1k
    • Posts
      651.8k
×
×
  • Criar Novo...