Ir al contenido



Foto

mostra datos en un input type="text"


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

#1 noe velazquez

noe velazquez

    Newbie

  • Miembros
  • Pip
  • 1 mensajes

Escrito 16 abril 2019 - 03:49

hola foro !!!

esperando me puedan ayudar les doy las gracias de antemano y es con lo siguiente.
tengo una tabla con 3 campos y son 95 registro 1.- (CLAVE), 2.-(AREA) y 3.- (TITULAR) 

Ejemplo
clave área titular
1.1 RECURSOS HUMANOS Lic. Alberto Goméz

lo que pretendo es mostrar la clave en un combo y cuando el usuario de clic en cualquiera de las claves
mostrar en un input type="text" el area y en otro input type="text" el titular como podría hacer esto?,,
cabe mencionar que estoy aprendiendo php
 
buscando me encontre este script que hace mas o menos lo que deseo, pero se no tengo aun los conocimientos de php menos de javascript
 
 



php
  1. <?
  2. /*
  3. require("conecta.php");
  4. $busca = "Select * From claves";
  5. $lista = mysqli_query($conectado,$busca);
  6. $datos = mysqli_fetch_array($lista);
  7. $areglo = array($datos);
  8. while ($fila = mysqli_fetch_array($lista)) {
  9. echo $fila['clave'];
  10. echo $fila['area'];
  11. echo " ";
  12. echo $fila['titular'];
  13. echo "<br>";
  14. } */
  15. ?>
  16.  
  17. <!DOCTYPE html>
  18. <html lang="es">
  19. <head>
  20.     <title>Captura Oficios</title>
  21.     <meta charset="utf-8">
  22. <script>
  23. //Este arreglo simula tu tabla.
  24. tabla = [
  25. {'clave':'11','area':'Direccion General de Administracion','titular':'Lic. Alberto Vazquez'},
  26. {'clave':'22','area':'Direcccion de Recursos Humanos','titular':'C. Juan Perez'},
  27. {'clave':'33','area':'Recursos Materiales','titular':'Dra. Guadalupe Reyes'}
  28. ];
  29.  
  30. window.onload = function(){
  31. // Poblamos el Select, esto lo deberias hacer con php
  32. select = document.getElementById('lstRegistros');
  33. tabla.forEach(function(registro){
  34. select.innerHTML += "<option value='"+registro.clave+"' data-area='"+registro.area+"' >"+registro.titular+"</option>";
  35. });
  36.  
  37. // Agregamos el evento para que cuando cambie la seleccion actualice los inputs
  38. select.addEventListener("change",putInfo);
  39. }
  40.  
  41. function putInfo(){
  42. optionSelected = this.options[this.selectedIndex];
  43. clave = this.value; // Obtengo el valor del Select
  44. area = optionSelected.dataset.area; // Obtengo el valor del dataset area
  45. titular = optionSelected.textContent; //Obtengo el texto del option seleccionado
  46.  
  47. //Asigno los valores a los inputs
  48. document.getElementById("txtClave").value=clave;
  49. document.getElementById("txtTitular").value=titular;
  50. document.getElementById("txtArea").value=area;
  51. }
  52. </script>    
  53. </head>
  54. <body>
  55. <select id="lstRegistros">
  56. <option value="" data-area=""></option>
  57. </select>
  58. <br />
  59. <table>
  60. <tr>
  61. <td>Clave:</td>
  62. <td>  <input type="text" id="txtClave" /></td>
  63. </tr>
  64. <tr>
  65. <td>Area:</td>
  66. <td><input type="text" id="txtArea" /></td>
  67. </tr>
  68. <tr>
  69. <td>Titular:</td>
  70. <td><input type="text" id="txtTitular" /></td>
  71. </tr>
  72. </table>
  73. </body>
  74. </html>

 
 
espero respuesta con ansiedad !!!!!!
GRACIAS


  • 0