Having a combobox showing the data of a COLUMN of a DB, how can I fill inputs with the other values?

Navigation
0

I have a database with a table called "sites" (phpmyadmin example):

I have a form where I have a select which I already have the query to the table "sites" to show only the data in the column "Site" of this same table, what I'm looking for is that other inputs are placed the value ("Reference", "Address", "Telephone", "City") corresponding to the "Site" selected in the selection.

Here is the code, thank you very much for taking the time to read my problem, greetings! 

<!DOCTYPE html>
<!--
 *
 * @author Zarate
-->
<html>
    <head>
        <?php
        $user = "root";
        $pass = "";
        $serv = "localhost";
        $dataB = "cdv1";
        
        $mysqli = new mysqli($serv, $user, $pass, $dataB);
        
        ?>
        
        <meta charset="UTF-8">
        <title>Solicita tu Cuenta</title>
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <script src="js/bootstrap.min.js"></script>
        <script src="js/jquery-3.2.1.min.js"></script>
<!--        <link rel="stylesheet" href="CSS/solicitud.css">-->
<!--        <script src="JS/soloLetras.js"></script>-->
        <script src="js/soloLetrasv2.js"></script>
        <script src="js/keyCURP.js"></script>
        <script src="js/soloNumeros.js"></script>
        <script src="js/letraCapital.js"></script>
        
    </head>
    
    <body>
        <form name="formSoli" action="Confirmacion.php" class="formSolicitud" method="POST">
            <button type="button" onclick="location='/CuentasDominio/login/index.php'" class="btnAdmin">
                <span class="glyphicon glyphicon-cog"></span>
            </button>
            <h1 class="formTitulo">Solicitud</h1>
            <label for="" class="formLabel">Nombre</label>
            <input type="text" name="nom" class="formInput" onselectstart="return false" autocomplete="off" title="Desactivar Bloq Mayus" maxlength="40" onpaste="return false" oncut="return false" oncopy="return false" onkeypress="return letraCapital(event,this);">
<!--            onkeypress="return letraCapital(event,this);" required onkeypress="return soloLetras(event);"-->
            
<!--            Se retiro ya que es necesario que el nombre y apellidos sea en minusculas, solo la primer letra mayuscula -> onKeyUp="this.value = this.value.toUpperCase();"-->
            <label for="" class="formLabel">Apellido Paterno</label>
            <input type="text" name="apeP" class="formInput" onselectstart="return false" autocomplete="off" title="Desactivar Bloq Mayus" maxlength="40" onpaste="return false" oncut="return false" oncopy="return false" onkeypress="return letraCapital(event,this);">
            <label for="" class="formLabel">Apellido Materno</label>
            <input type="text" name="apeM" class="formInput" onselectstart="return false" autocomplete="off" title="Desactivar Bloq Mayus" maxlength="40" onpaste="return false" oncut="return false" oncopy="return false" onkeypress="return letraCapital(event,this);">
            <label for="" class="formLabel">Titulo</label>
            <input type="text" name="titulo" class="formInput" autocomplete="off" placeholder="Ejemplo: Ingeniero en ..." title="Campo Opcional" maxlength="80" onpaste="return false" oncut="return false" oncopy="return false" required onKeypress="return soloLetrasv2(event);">
            <label for="" class="formLabel">Puesto</label>
            <input type="text" name="puesto" class="formInput" autocomplete="off" maxlength="70" onpaste="return false" oncut="return false" oncopy="return false">
            <label for="" class="formLabel">Departamento</label>
            <input type="text" name="depa" class="formInput" autocomplete="off" maxlength="70" onpaste="return false" oncut="return false" oncopy="return false">
            <!--            sitio-->
            <label for="" class="formLabel">Sitio</label>
            <select name="sitio" id="sitio" class="formSelect" title="Seleccione el sitio correspondiente" onmousedown="if(this.options.length>8){this.size=6;}" onchange='this.size=0;' onblur="this.size=0;">                
                <?php
                
                $query = $mysqli -> query ("SELECT * FROM Sitios");
                while ($valores = mysqli_fetch_array($query)) {
                    echo '<option>'.$valores[Sitio].'</option>';
                }
                ?>
            </select>
            
            
            <!--            input hidden-->
            <input type="text" name="ref" id="ref" value="">
            
            <input type="hidden" name="dom" id="dom" value="">
            <input type="hidden" name="tel" id="tel" value="">
            <input type="hidden" name="ciudad" id="ciudad" value="">
            
            <input type="hidden" name="email" value="">
            
            <label for="" class="formLabel">CURP</label>
            <input type="text" name="curp" class="formInput" onselectstart="return false" autocomplete="off" size="18" maxlength="18" onpaste="return false" oncut="return false" oncopy="return false" required onKeypress="return keyCURP(event);" onKeyUp="this.value = this.value.toUpperCase();">   
            <label for="" class="formLabel">N°Seguro Social</label>
            <input type="text" name="numSS" class="formInput" autocomplete="off" maxlength="12" onpaste="return false" oncut="return false" oncopy="return false" required onKeypress="return soloNumeros(event);">
            <label for="" class="formLabel">Matricula</label>
            <input type="text" name="matri" class="formInput" autocomplete="off" maxlength="9" onpaste="return false" oncut="return false" oncopy="return false" required onKeypress="return soloNumeros(event);">
            
            <input type="submit" src="Confirmacion.php" id="btnSoli" class="btn btn-primary btn-lg btn-block" value="Enviar Datos">
        </form>      
    </body>
</html>
    
asked by Eta Saints 27.12.2017 в 23:19
source

2 answers

0

I would go one step further and use the foreach that usually works best: 

<?php
     $query = $mysqli -> query ("SELECT * FROM Sitios");

     $valores = mysqli_fetch_array($query);

     foreach ($valores as $valor) { ?>

           <option><?php echo $valor["Sitio"] ?></option>

    <?php }
?>
    
answered by 28.12.2017 в 12:20
0

You should give the options a value and use a .change () function: 

$( ".target" ).change(function() {
  //Opción 1: Hacer consulta ajax con el valor del option
  //Opción 2: Guardar la consulta php en un script y recuperar los valores de ahí
});
    
answered by 31.12.2017 в 10:27
Why do not you return the data of the json? how to pass an image of a modal by ajax with laravel?