Jump to content


Photo

cargar informacion en input , FOrmulario

Started by dador33 , Sep 23 2013 02:20 PM

  • Please log in to reply
5 replies to this topic

#1 dador33

dador33

    Newbie

  • Miembros
  • Pip
  • 3 posts

Posted 23 September 2013 - 02:20 PM

Buenas ,,

tengo el siguinete formulario [html5]<body>
<form id="form1" name="form1" method="post" action="">
  <p>
    <label for="textfield"></label>
    Id:
    <input type="text" name="textfield" id="textfield" />
  </p>
  <p>
    <label for="textfield2"></label>
    Name:
    <input type="text" name="textfield2" id="textfield2" />
  </p>
  <p>
    <label for="textfield3"></label>
    Apellido:
    <input type="text" name="textfield3" id="textfield3" />
  </p>
  <p>
    <input type="submit" name="button" id="button" value="Enviar" />
  </p>
  <p>&nbsp;</p>
</form>
</body>[/html5]

Lo que deseo es lo siguiente: digito el id y en el momento de pulsar tab o pasar al campo nombre me muestre el nombre y apellido de este id, la informacion se obtiene desde una base de datos.

Gracias
  • 0

#2 porfi.dev

porfi.dev

    Advanced Member

  • Miembros
  • PipPipPip
  • 183 posts
  • LocationMy House @ México

Posted 25 September 2013 - 08:43 AM

El evento se llama "blur".

Los otros input los puedes colocar como "solo lectura" para que no ingresen los datos a mano o los cambien.

aqui te dejo un ejemplo sencillo basado en tu codigo:

http://jsfiddle.net/elporfirio/6Nvsq/

Obviamente despues podrás obtener las variables de una base de datos o similar, restringir si puede continuar etcetera, el limite tu imaginación ;)
  • 0

#3 dador33

dador33

    Newbie

  • Miembros
  • Pip
  • 3 posts

Posted 25 September 2013 - 10:14 AM

Tomo el ejemplo que me mencionas... pero no me ejecuta.. Estoy haciendo algo mal?
Pero en el link que se ejecuta en directo todo bien ,, pero lo llevo a la web . Y nada.



delphi
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Documento sin título</title>
  6. </head>
  7.  
  8. <body>
  9.  
  10.  
  11. <script language="javascript" type="text/javascript">
  12.  
  13.  
  14. $("#inId").on("blur",llenado);
  15.  
  16. function llenado(){
  17.     var id = $("#inId").val();
  18.     if(id == "JE"){
  19.         var nombre = "Juanito";
  20.         var apellido = "Escarcha";
  21.         
  22.         $("#button").attr("disabled", false);
  23.     }
  24.     else {
  25.         var nombre = "No disponible";
  26.         var apellido = "No disponible";
  27.         $("#button").attr("disabled", true);
  28.     }
  29.     
  30.     $("#inNombre").val(nombre);
  31.     $("#inApellido").val(apellido);
  32. }
  33.  
  34. </script>
  35.  
  36.  
  37.  
  38. <form id="formulario" name="formulario" method="post" action="" onSubmit="alert('enviado'); return false;">
  39.     <label>Id:</label>
  40.     <input type="text" name="inId" id="inId"  /><small>(introduce " JE ")</small>
  41.     <br>
  42.     <label>Nombre:</label>
  43.     <input type="text" name="inNombre" id="inNombre" readonly />
  44.     <br>
  45.     <label>Apellido:</label>
  46.     <input type="text" name="inApellido" id="inApellido" readonly/>
  47.     <br>
  48.     <input type="submit" name="button" id="button" value="Enviar" disabled />
  49. </form>
  50.  
  51. </body>
  52. </html>



  • 0

#4 porfi.dev

porfi.dev

    Advanced Member

  • Miembros
  • PipPipPip
  • 183 posts
  • LocationMy House @ México

Posted 25 September 2013 - 12:05 PM

te falto agregar la libreria de JQuery:

[html5]<script src="http://code.jquery.c...n.js"></script>[/html5]
  • 0

#5 dador33

dador33

    Newbie

  • Miembros
  • Pip
  • 3 posts

Posted 25 September 2013 - 01:30 PM

Tomo el archivo tal cual, agrego libreria, y llama la funcion de jquery,, la verdad no se que estoy haciendo mal.

Ademas una peticion, en que parte puedo aprender mas sobre java script.. me defiendo en php .. pero javascript estoy crudo. :D

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR...nsitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
</head>

<body>

<script src="http://code.jquery.c...1.10.1.min.js">
$("#inId").on("blur",llenado);

function llenado(){
    var id = $("#inId").val();
    if(id == "JE"){
        var nombre = "Juanito";
        var apellido = "Escarcha";
        
        $("#button").attr("disabled", false);
    }
    else {
        var nombre = "No disponible";
        var apellido = "No disponible";
        $("#button").attr("disabled", true);
    }
    
    $("#inNombre").val(nombre);
    $("#inApellido").val(apellido);
}

</script>



<form id="formulario" name="formulario" method="post" action="" onSubmit="alert('enviado'); return false;">
    <label>Id:</label>
    <input type="text" name="inId" id="inId" /><small>(introduce " JE ")</small>
    <br>
    <label>Nombre:</label>
    <input type="text" name="inNombre" id="inNombre" readonly />
    <br>
    <label>Apellido:</label>
    <input type="text" name="inApellido" id="inApellido" readonly/>
    <br>
    <input type="submit" name="button" id="button" value="Enviar" disabled />
</form>

</body>
</html>

  • 0

#6 matrixre9

matrixre9

    Newbie

  • Miembros
  • Pip
  • 3 posts

Posted 06 December 2013 - 11:01 AM

yo tengo esa misma duda el ejemplo es muy bueno,  pero como se podría adaptar para utilizar los datos de una BD en vez de juanito y escarcha

que realice una consulta y tome los elementos de una BD
  • 0
Back to PHP, Ajax, Javascript y HTML


  1. Comunidad Delphiaccess
  2. → PROGRAMACIÓN
  3. → Otros Lenguajes (.NET, Web, C, C++, Java, ASM)
  4. → PHP, Ajax, Javascript y HTML
  5. Privacy Policy
IP.Board spam blocked by CleanTalk.