0

Hola tengo 2 problemas el primero corresponde a que cargo en una tabla los datos de una consulta a mysql, la tabla se encuentra en un modal de boostrap los trae pero no carga la tabla como datatable sino como tabla común sin posibilidad de que se pueda ordenar por columna y sin scroll vertical.

El segundo problema es que cuando hago la consulta para traer los datos presionando en el boto listar me saca del modal y me devuelve a la página y tengo que volver a entrar al modal para ver la consulta ya cargada agrego el código del modal

<!-- modal form buscar -->

Busqueda de móviles × Seleccione Area SERVICIOS PÚBLICOS ESPACIOS VERDES OBRAS MUNICIPALES OBRAS PRIVADAS PARQUE AUTOMOTOR SEGURIDAD

    </div>
    <div class="col-md-3">
      <h2></h2>
    <button type="submit" id="listar" name="listar" class="btn btn-primary">Listar móviles</button>
  </div>
  </div>

      <div class="form-group">
        <label for="message-text" class="col-form-label">Móviles:</label>
         <table id="sampleTable2" class="table table-hover table-bordered display nowrap" cellspacing="0">


                                <thead >
                                   <tr>                                            
                                        <th>Patente</th>
                                        <th>Area</th>
                                        <th>Interno </th>
                                        <th>Marca</th>


                                    </tr>
                                </thead>
                                  <tbody>
                                    {height: 100px;
                                    overflow-y: auto;    
                                    overflow-x: hidden;}
                                  <?php
                                  while($row2 = mysqli_fetch_array($resultado))
                                    {
                                      echo '
                                      <tr>
                                      <td>'.$row2["Patente"].'</td>
                                      <td>'.$row2["Area_Responsable"].'</td>
                                      <td>'.$row2["Interno"].'</td>
                                      <td>'.$row2["Marca"].'</td>
                                      </tr> ';

                                    }
                                    mysqli_free_result($resultado)



                                 ?>
                                </tbody>
                                 <tfoot>
                                    <tr>
                                        <th>Patente</th>
                                        <th>Area</th>
                                        <th>Interno</th>
                                        <th>Marca</th>
                                    </tr>                                


                                </tfoot>



                            </table>
      </div>
    </form>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
    <button type="button" class="btn btn-primary">Seleccionar</button>
  </div>
</div>

La consulta funciona y esta hecha en php agrego parte del código

    $conn = mysqli_connect("localhost", "root", "", "movedb"); 
if(isset($_POST['listar']))
{
  $area = $_POST['area2'];
  if(!is_null($area)){
    $resultado= mysqli_query($conn,"SELECT Patente, Marca, Modelo, Tipo, Interno, Area_Responsable FROM moviles, areas where areas.Area_Responsable ='$area' and moviles.Id_Area = areas.Id_Area");




  }
4
  • Hola, ¿el datatable que estas mencionando es el de javascript?
    – JDavid
    el 12 jul. 2018 a las 13:35
  • si es el de las librerias javascript
    – Julio
    el 12 jul. 2018 a las 13:44
  • Tu segundo problema puede deberse a que tu botón listar es de tipo submit, lo que recarga la página, cambia el tipo del boton a "button" y eso debe resolverlo.
    – LuiscYm
    el 12 jul. 2018 a las 14:39
  • En cuanto al primer problema, como estas inicializando tu datatable? Para que la tabla se muestre como tal debes agregar algo como: $('#sampleTable2').DataTable( );, dentro de tus scripts.
    – LuiscYm
    el 12 jul. 2018 a las 14:46

1 respuesta 1

0

El segundo problema puede ser la forma en que has definido la ventana modal de bootstrap. agrega el siguiente codigo cuando cargue el DOM.

script...>

document.addEventListener('DOMContentLoaded', () => {
        $('#idVentanaModal').modal({
            keyboard: false,
            backdrop: 'static',
            show: true
        });
});

si show es false, para mostrarla, en la funcion...
$('#idVentanaModal').modal('show');
5
  • Perdón, que es el DOM?
    – Julio
    el 12 jul. 2018 a las 13:57
  • si usas modal debes tener jquery no?, luego algun archivo.js de tus scripts... cuando todo termina de cargar agrega en el ultimo archivo.js el siguiente codigo... el 12 jul. 2018 a las 14:01
  • document.addEventListener('DOMContentLoaded', () => { ... aqui dentro el codigo que puse arriba. }); el 12 jul. 2018 a las 14:01
  • Agrege el codigo pero no funciona...te muestro el script del modal
    – Julio
    el 12 jul. 2018 a las 14:11
  • <script type="text/javascript"> $('#exampleModal').on('show.bs.modal', function (event) { var button = $(event.relatedTarget) // Button that triggered the modal var recipient = button.data('btnConsulta') / var modal = $(this) modal.find('.modal-title').text('Busqueda de móviles') modal.find('.modal-body input').val(recipient) $('#exampleModal').modal({ keyboard: false, backdrop: 'static', show: false }); }) </script>
    – Julio
    el 12 jul. 2018 a las 14:13

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.