Select dependent PHP and MySQL

1

Greetings, I am creating a web application to register job vacancies using PHP, MySQL and a bit of Javascript. My problem is that I want to filter by educational level so that all records do not appear. I thought to use a switch inside PHP but it seems that it does not work. As data, the first select does not need to be taken from the Database, since I only need a key included in the value of "option" with which, I do the LIKE in the query. If you have a solution using those three tools (I want to avoid Ajax and jQuery because I do not dominate them much and I am upset with this solution), I would thank you in advance. I attach the code:

<div content>
    <table background="../img/201.png" cellspacing="21" align="center">
        <tr>
            <td>

                <br /> 
            </td>
        </tr>
        <form action="getQna.php" method="post">
        <tr>
            <td>
                Seleccionar el nivel educativo:
                <br />
                <select name="nivelE" id="nivelE" onchange="nivelEduc()">
                    <option value="ShowAll" selected="selected">Seleccione nivel:</option>
                    <option value="24DDI">Educaci&oacute;n Inicial</option>
                    <option value="24DJN">Preescolar</option>
                    <option value="24DPR">Primaria</option>
                    <option value="24DST">Secundarias T&eacute;cnicas</option>

                </select>
                <br />
                <br />
                Seleccionar la plaza vacante:
                <br />
                <select name="plazaS" id="plazaS" onchange="alerta()">
                    <option value="showAll" selected="selected">Seleccione:</option>
     <?php
    require_once 'config.php';


    $stmt = $dbcon->prepare('SELECT * FROM analitico where estatus="V"');
    $stmt->execute();

    while($row=$stmt->fetch(PDO::FETCH_ASSOC))
    {
        extract($row);
        ?>
        <option value="<?php $concat= $plaza . " " . $ct; echo $concat; ?>"><?php echo $plaza; ?></option> 
        <?php
    }
    ?>              
            </select>

        </td>
    </tr>
    <tr>
        <td>
            <label>Clave de Centro de Trabajo:</label>
                <br />
                <table>
                    <tr>
                        <td>
                        <input type="hidden" id="plaza" name="plaza"/> <!--Aquí se desconcatena-->
                        <input type="text"  id="ct" name="ct" readonly="readonly"/>
                        <input type="hidden" id="nivel" name="nivel"/>
                        </td>
                    </tr>
                </table>
        </td>
    </tr>
    <td align="justify">
    <!--Aquí se va a poner a elegir lo de la vacancia temporal o permanente--->
        Ingrese el inicio de la vacancia:
        <br />

            <input type="text" name="qna_ini" id="qna_ini" onkeypress="return isNumber(event)" maxlength="6" autocomplete="off"/>
    </td >
    <td align="justify">
        Ingrese el fin de la vacancia:
        <br />
            <input type="text" name="qna_fin" id="qna_fin" onkeypress="return isNumber(event)" maxlength="6" autocomplete="off" />

    </td>
    <tr>
        <td>
        <input type="submit" />
        </form>
        </td>
    </tr>
</table>

function alerta()
{   
     var x = document.getElementById("plazaS").value,
    separador = " ", // un espacio en blanco
    arregloDeSubCadenas = x.split(separador);
    console.log(arregloDeSubCadenas);
    document.getElementById("ct").value = arregloDeSubCadenas[1];
    document.getElementById("plaza").value = arregloDeSubCadenas[0];
}

function nivelEduc()
{
    var nivel=document.getElementById("nivelE").value;
    console.log(nivel);
    document.getElementById("nivel").value=nivel;
}
    
asked by Fernanda Pichardo 04.09.2017 в 20:21
source

1 answer

2

There is a JQuery library that is very easy to implement, it will prevent you from using AJAX, you just have to export it and add your filters it is called zelect .

Basically you only need these lines:

<select id="async-backed-zelect"></select>
$('#async-backed-zelect').zelect({ placeholder:'Plz select..' });

I think it would be very useful if you want to filter your select and minimize development times. I know it's JQuery but it's a cost for faster development, and fewer lines of code.

    
answered by 04.09.2017 в 20:35