Actualizar consulta SQL de una tabla en tiempo real en PHP

publicado por: Anonymous

Como ven en este codigo estoy tratando de hacer una pagina web que filtre resultados de una base de datos.
Los resultados que da son el id, la cantidad y el dinero total de las ventas de la fecha que se selecciono.

        <form action="" method="post">
            <center>
            <p class="vt">Ventas por</p>
            <input type="text" name="enviar">
            <select name="select">
                <option value="value1" selected>Dia</option> 
                <option value="value2">Semana</option>
                <option value="value3">Mes</option>
            </select>

            <button type="submit" name="enviar">Filtrar</button>
            </center>

            <br>
            <center>
            <table id="editable_table" class="table table-bordered table-striped">
            <tr> 
                <th>ID</th> 
                <th>CANTIDAD</th> 
                <th>INGRESO</th> 
                <th>FECHA</th>
            </tr> 

            <?php
                    require("con_db.php");

                    $sql = "SELECT v.id_venta, count(d.id_venta) as CANTIDAD, SUM(d.cantidad * d.precio) as suma, v.fecha AS f FROM ventas v INNER JOIN detalle_ventas d ON d.id_venta = v.id_venta WHERE MONTH(fecha)=$mes; GROUP by f ORDER BY fecha ASC ";
                    $result = mysqli_query($conex,$sql);

                    while($mostrar=mysqli_fetch_array($result)){
                    ?> 
                        <tr>
                            <td><?php echo $mostrar['id_venta'] ?></td>
                            <td><?php echo $mostrar['CANTIDAD'] ?></td>
                            <td><?php echo $mostrar['suma'] ?></td>
                            <td><?php echo $mostrar['f'] ?></td>
                        </tr>
                    <?php } ?>
            </table>
            </center>
        </form>

Quisiera saber si hay alguna forma para que cuando presione el botón de filtrar la tabla cambie (Sin necesidad de recargar la pagina) al dia, mes o semana que se selecciono en el select y en valor de el input.
En pocas palabras lo que necesito hacer es que por ejemplo si el select tiene seleccionado Semana y el imput tene un valor de 5, al dar en el boton de filtrar, la tabla se recargue con el siguiente query

SELECT v.id_venta, count(d.id_venta) as CANTIDAD, SUM(d.cantidad * d.precio) as suma, v.fecha AS f FROM ventas v INNER JOIN detalle_ventas d ON d.id_venta = v.id_venta WHERE WEEK(fecha)=5; GROUP by f ORDER BY fecha ASC 

Cambiando el tipo a WEEK y el valor a 5.

Aqui esta la base de datos:
Tabla ventas:

CREATE TABLE `ventas` (
  `id_venta` int(11) NOT NULL,
  `id_usuario` int(11) NOT NULL,
  `fecha` datetime NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

INSERT INTO `ventas` (`id_venta`, `id_usuario`, `fecha`) VALUES
(1, 2, '2020-04-25 06:33:56'),
(2, 2, '2020-03-21 15:33:56'),
(3, 2, '2020-02-28 15:33:56'),
(4, 3, '2020-02-03 15:33:56'),
(5, 3, '2020-01-07 15:33:56'),
(6, 4, '2020-05-25 15:33:56'),
(7, 4, '2020-04-27 15:33:56'),
(8, 5, '2020-03-16 15:33:56'),
(9, 5, '2017-12-05 15:33:56'),
(10, 6, '2020-01-15 15:33:56'),
(11, 7, '2019-11-09 15:33:56'),
(12, 7, '2019-10-05 15:33:56'),
(13, 7, '2020-05-12 15:33:56'),
(14, 7, '2020-01-28 15:33:56'),
(15, 8, '2020-03-01 15:33:56'),
(16, 9, '2020-04-17 15:33:56'),
(17, 10, '2020-02-09 15:33:56'),
(18, 11, '2019-11-05 15:33:56'),
(19, 11, '2020-02-12 15:33:56'),
(20, 11, '2020-03-21 15:33:56'),
(21, 11, '2020-03-21 15:33:56'),
(22, 11, '2020-04-26 15:33:56'),
(23, 1, '2020-05-05 15:33:56'),
(24, 2, '2020-05-05 21:40:58');

Tabla detalle_ventas:

CREATE TABLE `detalle_ventas` (
  `id_venta` int(11) NOT NULL,
  `id_producto` int(11) NOT NULL,
  `precio` double NOT NULL,
  `cantidad` int(11) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;

INSERT INTO `detalle_ventas` (`id_venta`, `id_producto`, `precio`, `cantidad`) VALUES
(1, 2, 18000.9, 1),
(1, 4, 4898.99, 1),
(1, 1, 40000, 2),
(2, 3, 25000, 1),
(3, 4, 4898.99, 1),
(4, 6, 12000, 1),
(4, 8, 7000, 2),
(4, 11, 5400, 1),
(5, 14, 560, 1),
(6, 10, 2300.56, 3),
(6, 13, 230, 2),
(6, 12, 300, 1),
(7, 16, 17000, 1),
(8, 4, 4898.99, 3),
(8, 1, 40000, 3),
(8, 9, 1000, 1),
(8, 10, 2300.56, 2),
(8, 15, 430, 2),
(9, 3, 25000, 1),
(10, 3, 25000, 4),
(11, 6, 12000, 2),
(12, 1, 40000, 1),
(13, 14, 560, 1),
(14, 4, 4898.99, 5),
(15, 7, 3000, 3),
(15, 9, 1000, 1),
(15, 13, 230, 1),
(15, 11, 5400, 1),
(15, 12, 300, 2),
(16, 13, 230, 1),
(17, 6, 12000, 1),
(17, 15, 430, 2),
(18, 8, 7000, 2),
(18, 7, 3000, 2),
(19, 2, 18000.9, 1),
(20, 4, 4898.99, 1),
(21, 12, 300, 2),
(21, 8, 7000, 1),
(22, 10, 2300.56, 1),
(22, 14, 560, 2),
(23, 5, 17, 5),
(23, 5, 17, 3),
(24, 2, 18000.9, 1);

solución

Lo que puedes hacer es utilizar ajax para realizar la peticion a tu archivo de php sin que se recargue tu pagina.

Ejemplo:

en html

<!--puedes agregar un id si requieres  enviar todo el formulario--->
<form id="form_filtro" action="" method="post" onsubmit="return false;">
    <center>
    <p class="vt">Ventas por</p>
    <input type="text" name="enviar">
    <select name="select">
        <option value="value1" selected>Dia</option> 
        <option value="value2">Semana</option>
        <option value="value3">Mes</option>
    </select>

    <button type="submit" name="enviar">Filtrar</button>
    </center>
</form>
<br>
<center>
    <table id="editable_table" class="table table-bordered table-striped">
        <thead>
        <tr> 
            <th>ID</th> 
            <th>CANTIDAD</th> 
            <th>INGRESO</th> 
            <th>FECHA</th>
        </tr> 
        </thead>
        <tbody><!--contenido-->
        </tbody>
    </table>
</center>

en java script

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
$(document).on('submit', "#form_filtro", function (event, callback) {
    let filtrarPor=$("select[name='select']").val();
    $.ajax({
        url: 'consult.php',//ruta de tu archivo php en el cual se hace la consulta y se obtendra el resultado 
        type: 'POST',
        dataType:'html',//dataType: xml, json, script, o html
        data: {filtrarPor : filtrarPor },//se evia el valor seleccionado en tu select
        success: function (result) {       
            $("#editable_table tbody").html(result);//si la peticion se realizo sin errores te regresara un valor y lo insetas en tu table html
        },
        error: function (jqXHR, status, error) {        
            alert("error");
        }
    });
});

en tu archivo php

<?php
$filtro=$_POST["filtrarPor"];//es el dato que se selecciono en tu select
require("con_db.php");
//tu consulta lo adaptas dependiendo del valor de $filtro
$sql = "SELECT v.id_venta, count(d.id_venta) as CANTIDAD, SUM(d.cantidad * d.precio) as suma, v.fecha AS f FROM ventas v INNER JOIN detalle_ventas d ON d.id_venta = v.id_venta WHERE MONTH(fecha)=$mes; GROUP by f ORDER BY fecha ASC ";
$result = mysqli_query($conex,$sql);
$html="";
while($mostrar=mysqli_fetch_array($result)){
    $html.="
        <tr>
            <td>".$mostrar['id_venta']."</td>
            <td>".$mostrar['CANTIDAD']."</td>
            <td>".$mostrar['suma']."</td>
            <td>".$mostrar['f']."</td>
        </tr>";
}
echo $html;//utilizar utf8_decode($html) por si el contenido tiene caracteres especiales
Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *