How to load a table with jquery through a filter made with a button that takes the value of a select?

0

I am trying to load my table using jquery but it is not possible for me, I do not know how to pass the value of the query to the query, I have made several attempts with JSON but it does not work for me, if someone can explain it I would appreciate it .

Here I have the code of the button and the select File listProgram.php

<div class="form-group">
                            <label for="selectFacultad" class="col-sm-1 control-label">Facultad:</label>
                                    <div class="col-sm-4"><select name="idFacultad" id="selectFacultad" class="form-control"  >
                                        <option>Seleccione</option>
                                    </select></div>
                             <button class="btn btn-primary fa fa-search" id="buscar"></button>
                        </div>

In that same file I have the following scripts to fill the select and load the table

<script type="text/javascript">
             function getData(){
                 $.ajax({
                    type: "GET",
                    url: 'http://localhost/proyecto/consultarFacultad.php', 
                    dataType: "json",
                    success: function(data){
                      $.each(data,function(key, registro) {
                        $("#selectFacultad").append('<option value='+registro.id_facultad+'>'+registro.nombre_facultad+'</option>');
                      });        
                    },
                    error: function(data) {
                      alert('error');
                    }
                  });
             }
        </script>

<script type="text/javascript">
     $(document).ready(function(){
         $('#buscar').click(function(){
             var codigoFacultad = $('#selectFacultad').serialize();

             $.ajax({
            url:"llenarPrograma.php",
            type: "POST",
            data:codigoFacultad,
            contentType: "application/x-www-form-urlencoded",
            dataType:"json",
            success: function(data){
                $('#contenido').html('');
                if(data != null && $.isArray(data)){
                 $.each(data,function(i,item){
                   $('#contenido').append("<tr><td>" + value.id_programa + "</td><td>" + value.nombre_programa +"</td><td>"+value.duracion_semestral+"</td><td>"+value.horario+"</td><td>"+value.metodologia+"</td><td><button class='btn btn-primary fa fa-edit'><button class='btn btn-danger fa fa-trash-o'></td>"+"</tr>");
              });

            });
            });
             });

        }

    </script>

File fillProgram.php

<?php
 include_once('conexion.php');
 ob_start();
 mysqli_set_charset($conexion,"utf8");

 $cod_facultad = $_POST['codigoFacultad'];

 $sql = mysqli_query($conexion,"SELECT id_programa,nombre_programa,duracion_semestral,horario,metodologia FROM programa WHERE id_facultad = '".$cod_facultad."'");

 //CREAS UN ARRAY
$Data = array();

while($datos = mysqli_fetch_object($sql)){
   $Data[] = array("id_programa"=>$datos->id_programa,
                   "nombre_programa"=>$datos->nombre_programa,
                  "duracion_semestral"=>$datos->duracion_semestral,
                  "horario"=>$datos->horario,
                  "metodologia"=>$datos->metodologia);
}
 echo ''.json_encode($Data).'';

 mysqli_close($conexion);
 header('Content-type: application/json');
 header('access-content-allow-origin: *');
?>

I would appreciate your help

    
asked by Carlos Alberto Guerrero Navarr 05.11.2018 в 19:51
source

1 answer

0

You are not telling him to pick the chosen option. You would have one thing like this:

 $("#selectFacultad option:selected").val();
    
answered by 29.11.2018 в 17:04