Ir al contenido


Foto

cargar informacion en input , FOrmulario


  • Por favor identifícate para responder
5 respuestas en este tema

#1 dador33

dador33

    Newbie

  • Miembros
  • Pip
  • 3 mensajes

Escrito 23 septiembre 2013 - 02:20

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 mensajes
  • LocationMy House @ México

Escrito 25 septiembre 2013 - 08:43

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 mensajes

Escrito 25 septiembre 2013 - 10:14

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 mensajes
  • LocationMy House @ México

Escrito 25 septiembre 2013 - 12:05

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 mensajes

Escrito 25 septiembre 2013 - 01:30

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 mensajes

Escrito 06 diciembre 2013 - 11:01

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




IP.Board spam blocked by CleanTalk.