Estoy tratando de recorrer todas las líneas de bonificación (generalmente hay miles de ellas) para aprobar cada una en la llamada ajax. La razón por la que no hice un método "approveAll" es porque cada encabezado de bonificación tiene varios elementos de línea asociados. Aprobar todos los métodos expirará. Entonces, hacer una llamada ajax una a la vez parece ser la mejor solución.
Sin embargo, con mi código, me encontré con dos problemas. 1. Parece que el registro tiene muchos errores. Ingrese la descripción de la imagen aquí .
y 2. parece que solo la mitad de la llamada ajax tuvo éxito. La barra de progreso se detiene en el 46 % y mi base de datos tiene la mitad de la línea de bonificación sin actualizar.
ingrese la descripción de la imagen aquí
function approveAll(){ $("#awaitModal").modal('show'); var url, tr, total, completed, percentage url = "/Index?handler=ApproveOneBonus" tr = document.getElementById('bonusTable').getElementsByClassName('bonusLine') total = tr.length console.log(total) completed = 0 for(i=0; i<total; i++){ bonusId = tr[i].id.replace("bonusItem","")+"" $.ajax({ type: "POST", url: url, async: true, headers: { "RequestVerificationToken": '@GetAntiXsrfToken()' }, data: {"bonusId":bonusId}, success: function(resp){ completed = completed + 1 percentage = completed/total*100 updateProgress(percentage) }, complete:function(){ } }); } } function updateProgress(percentage){ if(percentage > 100){ percentage = 100 } $('#progressBar').css('width', percentage+'%'); $('#progressBar').attr('aria-valuenow', percentage); $('#progressBar').html(percentage+'%'); } <div class="modal fade" tabindex="-1" id="awaitModal" data-keyboard="false" data-backdrop="static"> <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-body"> Please wait... <div class="progress progress-striped active" style="height:44px;"> <div id="progressBar" class="progress-bar" role="progressbar" style="width:1%;"></div> </div> </div> </div> </div> </div>