0

Los datos se agregan mediante un botón y se insertan en la base de datos. Mediante el botón listar se ven todos los datos que se han agregado; el problema es que los datos no se actualizan automáticamente. Tengo que recargar la página para que aparezcan los registros que acabé de ingresar, la idea es que cuando se inserte el registro aparezca automáticamente en la tabla de la ventana modal

código del formulario donde se agregan los datos

        <center>
          <br>
          <br>
          <br>
          <br>
            <center>

            <h4 style="color:white;">Ordenacion de procedimientos</h4>

            <div class="todo" style="float:left;width:100%;">
               
               
              
                <div class="medicamentos" style=" width:100%; ">
         <br>
              <label for="" style="color:white;">Medicamentos</label>
                        
                <br>
                <br>
            
                <div style="position:absolute;">
                <form action="" method="post" id="medicamentos">
              
                    <label for="">suministracion</label>
                    <br>
                    <select name="tipdoc" id="administracion" class="select-css" style="width:190px;">
                        <?php 
                        $con = mysqli_query($mysqli, "SELECT * from viaadministracion");
                        while($di = mysqli_fetch_array($con)){                       
                        ?>
                        <option value="<?php echo $di[0]?>"><?php echo $di[1]?></option>
                        <?php  } ?>
                    </select>
                </div>
                <div style="float:left; position:absolute; left:15rem;">
                    <label for="">Medicamento</label>
                    <br>
                    <select id="medicamento" name="medicamento" class="medicamento" style="width:190px;">
                        <option value="0">Seleccione</option>
                    </select>
                </div>
                <script>
                    $(document).ready(function() {
                        var medicamento = $('#medicamento');
                       
                        $('#administracion').change(function() {
                           
                            var administracion = $(this).val();
                            $.ajax({
                                data: {
                                    administracion: administracion
                                },
                                dataType: 'html',
                                type: 'POST',
                                url: 'getmedicamento.php',
                            }).done(function(data) {
                                medicamento.html(data);
                            });
                        });
                    });
                    </script>

               
                <div style="float:left; position:absolute; left:28rem;">
                    <label for="">Medida o concentracion</label>
                    <br>
                    <input type="text" id="concentracion" name="concentracion">
                </div>
                <div style="float:left; position:absolute; left:40rem;">
                    <label for="">Cantidad por toma</label>
                    <br>
                    <input type="text" id="cantidadportoma" name="cantidadportoma">
                </div>
                <div style="float:left; position:absolute; left:52rem;">
                    <label for="">Tomar cada(en horas)</label>
                    <br>
                    <input type="number" id="periodos" name="periodos">
                </div>
                <div style="float:left; position:absolute; left:64rem;">
                    <label for="">Duracion en dias</label>
                    <br>
                    <input type="number" id="duracion" name="duracion">
                </div>
                <!--capturo el id de la consulta-->
                <?php 
                $consulta = "SELECT idconsulta from consulta where idcita = $idcita";
                $query = mysqli_query($mysqli, $consulta);
                if($query){
                    $fila = mysqli_fetch_assoc($query);
                    $implode = implode($fila);
                }
                ?>

                <input type="hidden" value = <?php echo $implode?> name="consulta" id="idconsulta">
              
                <div style="float:left; position:absolute; left:75rem;top:58rem; width:120px;">
                 
                    <input type="submit" value="Agregar" style="width:70px; background-color:white; border-color:white;cursor:pointer;" id="agregar"> 
                </div>
                <div style="float:left; position:absolute; left:75rem;top:59.6rem; width:120px;">
                 
                    <input type="submit" value="Ver" style="width:70px; background-color:white; border-color:white;cursor:pointer;" id="ver"> 
                </div>
                </div>
             <div>
             </form>
             
             </center>
    </div> 
    <script type="text/javascript">
    $("#agregar").on('click', function() {
        medicamentos = $("#medicamento").val();
        concentracion = $("#concentracion").val();
        cantidadportoma = $("#cantidadportoma").val();
        duracion = $("#duracion").val();
        periodos = $("#periodos").val();

        if(medicamentos == 0){
            alert("Selecciona el medicamento");
            event.preventDefault();
        }
       
        else if(concentracion == 0){
            alert("Selecciona la concentracion del medicamento");
            event.preventDefault();
        }
        
        else if(cantidadportoma == 0){
            alert("Digita la cantidad por toma del medicamento");
            event.preventDefault();
        }
       
        else if(periodos == 0){
            alert("Cada cuanto se debe tomar el medicamento");
            event.preventDefault();
        }
        
         else if(duracion == 0){
            alert("Cuanto dura el tratamiento");
            event.preventDefault();
        }
        else {  
        var url = "ordenarmedicamentos.php";
        $.ajax({
            type: 'POST',
            url: url,
            data: $("#medicamentos").serialize(),
            success: function(data) {
              
                alert(data);
              
                $("#concentracion").val("");
                $("#cantidadportoma").val("");
                $("#periodos").val("");
                $("#duracion").val("");                             
            }
        });
        return false;
    }
 
    });
    </script>

    
   
    </div>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    <br>
    
    </div>

código de la ventana modal donde se muestran los datos que se han insertado previamente desde el formulario de HTMLy PHP........................................................................................................................................................


   <div class="ventanamedicamentos" id="modal">
    <div class="things">
        <a href="" style="position:absolute;right:5px;color:white;text-decoration:none;background-color:blue;" onclick="cerrar()">X</a>
        <center> 
            <br>
            
            <H3 style="color:white;">Lista de medicamentos</H3>
           <br>
           <div id="">
           
        <table id="tablacosas">
            <thead align="center" ; style="">
      
                <td>Medicamento</td>
                <td>Concentracion o medida</td>
                <td>Cantidad por toma</td>
                <td>Tomar cada</td>
                <td>Duracion dias</td>
                <td>Acciones</td>
                
            </tr>
                

            </thead>
            <tbody>
            <?php 
            ##recibo el id del la consulta
                   
            $con = "SELECT * from detalleordenmedicamentos inner join medicamento using(idmedicamento) where idconsulta = '$implode'";
            $m = mysqli_query($mysqli, $con);
            while($eh = mysqli_fetch_array($m)){           
            ?>

            <tr align="center"; style="height:2rem;">
                <td style="display:none;"><?php echo $eh['iddetallemedicamentos']?></td>
                <td contenteditable='true'><?php echo $eh['nombre']?></td>
                <td><?php echo $eh['medida']?></td>
                <td><?php echo $eh['cantidadtoma']?></td>
                <td><?php echo $eh['tomarcada']?></td>
                <td><?php echo $eh['duraciondias']?></td>   
                <td><img style="width:1.8rem;" src="data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgNTEyIDUxMiIgaGVpZ2h0PSI1MTIiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiB3aWR0aD0iNTEyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnPjxwYXRoIGQ9Im00MjQgNjRoLTg4di0xNmMwLTI2LjQ2Ny0yMS41MzMtNDgtNDgtNDhoLTY0Yy0yNi40NjcgMC00OCAyMS41MzMtNDggNDh2MTZoLTg4Yy0yMi4wNTYgMC00MCAxNy45NDQtNDAgNDB2NTZjMCA4LjgzNiA3LjE2NCAxNiAxNiAxNmg4Ljc0NGwxMy44MjMgMjkwLjI4M2MxLjIyMSAyNS42MzYgMjIuMjgxIDQ1LjcxNyA0Ny45NDUgNDUuNzE3aDI0Mi45NzZjMjUuNjY1IDAgNDYuNzI1LTIwLjA4MSA0Ny45NDUtNDUuNzE3bDEzLjgyMy0yOTAuMjgzaDguNzQ0YzguODM2IDAgMTYtNy4xNjQgMTYtMTZ2LTU2YzAtMjIuMDU2LTE3Ljk0NC00MC00MC00MHptLTIxNi0xNmMwLTguODIyIDcuMTc4LTE2IDE2LTE2aDY0YzguODIyIDAgMTYgNy4xNzggMTYgMTZ2MTZoLTk2em0tMTI4IDU2YzAtNC40MTEgMy41ODktOCA4LThoMzM2YzQuNDExIDAgOCAzLjU4OSA4IDh2NDBjLTQuOTMxIDAtMzMxLjU2NyAwLTM1MiAwem0zMTMuNDY5IDM2MC43NjFjLS40MDcgOC41NDUtNy40MjcgMTUuMjM5LTE1Ljk4MSAxNS4yMzloLTI0Mi45NzZjLTguNTU1IDAtMTUuNTc1LTYuNjk0LTE1Ljk4MS0xNS4yMzlsLTEzLjc1MS0yODguNzYxaDMwMi40NHoiLz48cGF0aCBkPSJtMjU2IDQ0OGM4LjgzNiAwIDE2LTcuMTY0IDE2LTE2di0yMDhjMC04LjgzNi03LjE2NC0xNi0xNi0xNnMtMTYgNy4xNjQtMTYgMTZ2MjA4YzAgOC44MzYgNy4xNjMgMTYgMTYgMTZ6Ii8+PHBhdGggZD0ibTMzNiA0NDhjOC44MzYgMCAxNi03LjE2NCAxNi0xNnYtMjA4YzAtOC44MzYtNy4xNjQtMTYtMTYtMTZzLTE2IDcuMTY0LTE2IDE2djIwOGMwIDguODM2IDcuMTYzIDE2IDE2IDE2eiIvPjxwYXRoIGQ9Im0xNzYgNDQ4YzguODM2IDAgMTYtNy4xNjQgMTYtMTZ2LTIwOGMwLTguODM2LTcuMTY0LTE2LTE2LTE2cy0xNiA3LjE2NC0xNiAxNnYyMDhjMCA4LjgzNiA3LjE2MyAxNiAxNiAxNnoiLz48L2c+PC9zdmc+"/><img style="width:1.8rem;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pg0KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE4LjEuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPg0KPHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJDYXBhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMzIuMjk2IDMyLjI5NiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzIuMjk2IDMyLjI5NjsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggc3R5bGU9ImZpbGw6IzAzMDEwNDsiIGQ9Ik0zMS45MjMsOS4xNEwxMy40MTcsMjcuNjQyYy0wLjQ5NiwwLjQ5NC0xLjI5OSwwLjQ5NC0xLjc5MywwTDAuMzcsMTYuMzE2DQoJCWMtMC40OTQtMC40OTYtMC40OTQtMS4zMDIsMC0xLjc5NWwyLjY4OS0yLjY4N2MwLjQ5Ni0wLjQ5NSwxLjI5OS0wLjQ5NSwxLjc5MywwbDcuNjc4LDcuNzI5TDI3LjQzOCw0LjY1NA0KCQljMC40OTQtMC40OTQsMS4yOTctMC40OTQsMS43OTUsMGwyLjY4OSwyLjY5MUMzMi40MjEsNy44NCwzMi40MjEsOC42NDYsMzEuOTIzLDkuMTR6Ii8+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8Zz4NCjwvZz4NCjxnPg0KPC9nPg0KPGc+DQo8L2c+DQo8L3N2Zz4NCg==" /></td>  
                
            </td>
                
                
            </tr>
            <?php
            } 
            ?>
            </tbody>
           
        </table>
        <br>
        <br>
        <?php
        $eps = "SELECT ideps from usuario where documento = '$documentopaciente'";
        $quer = mysqli_query($mysqli, $eps);
        $fila = mysqli_fetch_assoc($quer);
        $epsfinal = implode($fila);

        ?>
        <?php
        $muni = "SELECT id_municipio from usuario inner join barrio using(idbarrio) inner join municipios using(id_municipio) where documento = '$documentopaciente'";
        $quere = mysqli_query($mysqli, $muni);
        $fik = mysqli_fetch_assoc($quere);
        $municipio = implode($fik);

        ?>
        <input type="hidden" value = "<?php echo $epsfinal ?>" id="ideps">
        <input type="hidden" value = "<?php echo $municipio ?>" id="idmunicipio">
        <input type="submit" value="Verpdf">
        <br>
        <br>
        <input type="submit" id="ordenar" value="Ordenar" style="width:200px;
    background-color:rgb(97, 97, 224);
    border-radius:5px;
    border-color:white;
    color:white;
    height:21px;hover:width:197px;
    cursor:pointer;
">

        </center>
        </div>
    </div>
    </div> 

    <script type="text/javascript">
    $("#ordenar").on('click', function() {
        var url = "autorizacionmedicamentos.php";
        idconsulta = $("#idconsulta").val();
        ideps = $("#ideps").val();
        idmunicipio = $("#idmunicipio").val();
        $.ajax({
            type: 'GET',
            url: url,
            data: {idconsulta:idconsulta, ideps: ideps, idmunicipio: idmunicipio},
            success: function(data) {
                alert(data);
                
                
            }

        });
        return false;

    });
    </script>

    <script type="text/javascript">
    $("#ver").on('click', function() {
        event.preventDefault();
        document.getElementById("modal").style.display="block";
       

    

    });
    </script>

    <script>
    function cerrar(){
        event.preventDefault();
        document.getElementById("modal").style.display="none";

    }
    </script>
    <!--ordenacion de examenes-->
  
  <div class="">
        <center>
          <br>
          <br>
          <br>
          <br>
            <center>

4
  • Con Javascript: el conocido AJAX o el experimental (pero ampliamente soportado y más fácil) fetch. son mecanismos para llamar al servidor y recibir datos sin recargar la página.
    – Juan
    Commented el 12 jul. 2021 a las 13:43
  • ¿Cuál es el código de getmedicamento.php?
    – A. Cedano
    Commented el 12 jul. 2021 a las 13:51
  • es para traer el medicamento acorde a su uso Commented el 12 jul. 2021 a las 14:41
  • no tiene nada que ver con la actualizacion de la tabla Commented el 12 jul. 2021 a las 14:41

2 respuestas 2

1

Ya que lo que buscas es que se actualicen los datos, lo mas recomendable seria usar ajax cuando des clic en tu boton listar.

Para aquello en tu función JS ver debes agregar el ajax que traiga esos datos:

$("#ver").on('click', function() {
    $.ajax({
        data:  {dato: 'refrescar'},//cambiar con lo que creas acorde
        url:   'update.php',//archivo que contendra el html de tu tabla
        type:  'post',
        beforeSend: function () {
            $('#lista').html('Actualizando lista');
        },
        success:  function (response) {                         
            $('#lista').html(response);//una vez tengamos respuesta, llenamos el div lista y mostramos el modal.
            document.getElementById("modal").style.display="block";
        }
    });     
});

Bueno en este caso agregue un div con id lista para que se muestren los datos, es decir esto:

<div class="ventanamedicamentos" id="modal">
    <div class="things">
        <a href="" style="position:absolute;right:5px;color:white;text-decoration:none;background-color:blue;" onclick="cerrar()">X</a>
        <center> 
            <br>        
            <H3 style="color:white;">Lista de medicamentos</H3>
            <br>
            <div id="listar">
            <!-- Aqui ira tu tabla con los datos -->
            </div>
        </center>
    </div>
</div>

Por ultimo el codigo que tiene tu tabla tablacosas cortalo y pegalo en el archivo update.php:

<table id="tablacosas">
.
.
.
</table>

Entonces la idea es que cuando des clic en ver vaya al archivo update.php consulte datos y muestre la información, asi cada vez que des clic se actualizarian los datos.

1
  • funciona, gracias men Commented el 14 jul. 2021 a las 14:41
0

Te recomiendo utilizar dentro del script JS la funcion setInterval(). Para su uso necesitas una constante con el valor de tiempo para refrescar el elemento que deseas, en este caso los datos que retornan tu consulta. Este valor se expresa en milisegundos.

Su declaracion deberia ser:

setInterval(function() {
"el proceso de consulta de datos"}, "tiempo de actualizacion constante");

Aca dejo el link de W3 Schools con las funciones aplicadas al tiempo en JavaScript. https://www.w3schools.com/js/js_timing.asp

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

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