2

Estoy imprimiendo una tabla con datos guardados en una base de datos. En la tabla hay 2 input y un total, donde el total es el producto los dos input.

Cuando hace la cuenta (lo hago con Ajax para no recargar la pagina) lo guarda en la base de datos en caso de que se haya modificado algo. Eso lo hace bien pero no me actualiza en el momento el total, solo si hago F5 en la pagina me muestra el resultado pero es el que trae de la base de datos.

Cual puede ser el error?

<script>
$(document).ready(function(){
    $(document).on('submit', '#formulario_modificar', function() {
        //Obtenemos datos formulario.
        var idprovisorio = $('#idp').val();
        $this = $(this);
        //AJAX.
        $.ajax({
            type : 'POST',
            url  : 'modificar_ajax.php',
            data:  $(this).serialize(),

            success:function(e) {
              console.log(e);
              $this.parent().find("#table-id-"+idprovisorio).html(e);
            }
        });
        return false;
   });
});//Fin document.			
</script>
<tr>
   <td><? echo $row['idproducto'] ?></td>
   <td><? echo $bp['descripcion'] ?></td>
   <form id="formulario_modificar" class="formulario">
     <input type="hidden" name="idp" id="idp" value="<? echo $row['idprovisorio'] ?>">
     <td class="td_table">
           <input name="cant" class="input_table" value="<? echo $row['cantidad'] ?>">
      </td>
     <td class="td_table">
            <input name="prec" class="input_table" value="<? echo $row['precio'] ?>">
     </td>
     <td id="table-id-<? echo $row['idprovisorio'] ?>">
           <? echo $row['total'] ?>
     </td>
     <input type="submit" name="cargar" value="Cargar" style="display: none;">
  </form>

2
  • No creo que sea necesario hacer una multiplicación en el backend, de hecho recargas mas la página haciendo ajax que haciendolo directamente en el frontend. Si tienes que guardar esos datos obviamente si es necesario que hagas ajax.
    – Emeeus
    Commented el 30 ago. 2019 a las 13:07
  • Diego, si alguna de las respuestas solucionó tu pregunta te invito a aceptarla, así servirá de referencia para futuros visitantes. En caso contrario deja un comentario para revisar como se puede mejorar.
    – DjCrazy
    Commented el 8 nov. 2019 a las 12:14

2 respuestas 2

0

Este es un ejemplo con datos "quemados en el código" pero puedes reemplazar los valores de los input con los valores que traes de la BD:

//Si cambia la cantidad
$('.cantidad').change(function(){
  //calculo el nuevo total
  $('.total').val($('.cantidad').val() * $('.valor').val());
})

//O si cambia el valor
$('.valor').change(function(){
  //calculo el nuevo total
  $('.total').val($('.cantidad').val() * $('.valor').val());
})

//Envías por ajax los nuevos datos
//comentado para no generar error en consola

/*$('#formulario_modificar').on('submit', function() {
  ....código para submit.....
}*/
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<label for="cantidad">Cantidad</label>
<input type="" class="cantidad" name="cantidad" value="10">
<!--Reemplaza el atributo value="10" con los datos que traes de BD-->
<br>

<label for="valor">Valor</label>
<input type="" class="valor" name="valor" value="5000">
<!--Reemplaza el atributo value="5000" con los datos que traes de BD-->
<br>

<label for="total">Total</label>
<input type="" class="total" name="total" value="50000">
<!--Reemplaza el atributo value="50000" con los datos que traes de BD-->
<br>

<button type="submit">Enviar</button>

0

El problema al parecer radica en la forma que intentas alterar el valor del HTML, he corregido tu código de la siguiente manera:

<script>
$(document).ready(function(){
    $(document).on('submit', '#formulario_modificar', function() {
        //Obtenemos datos formulario.
        var idprovisorio = $('#idp').val();
        $this = $(this);
        //AJAX.
        $.ajax({
            type : 'POST',
            url  : 'modificar_ajax.php',
            data:  $(this).serialize(),

            success:function(e) {
              console.log(e);
              $("#table-id-"+idprovisorio).html(e); //Solo busca el elemento por su id y altera el valor
            }
        });
        return false;
   });
});//Fin document.          
</script>
<tr>
   <td><? echo $row['idproducto'] ?></td>
   <td><? echo $bp['descripcion'] ?></td>
   <form id="formulario_modificar" class="formulario">
     <input type="hidden" name="idp" id="idp" value="<? echo $row['idprovisorio'] ?>">
     <td class="td_table">
           <input name="cant" class="input_table" value="<? echo $row['cantidad'] ?>">
      </td>
     <td class="td_table">
            <input name="prec" class="input_table" value="<? echo $row['precio'] ?>">
     </td>
     <td id="table-id-<? echo $row['idprovisorio'] ?>">
           <? echo $row['total'] ?>
     </td>
     <input type="submit" name="cargar" value="Cargar" style="display: none;">
  </form>

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.