javascript - How to wait for AJAX calls in an each loop to complete before moving on without ASYNC: FALSE -
i have setup ajax php set of functions processes number of items on page. code inserts series of tasks database, inserts supplies database based on newly created task id's. works 90% of time. seems though task id's not created first doesn't allow supplies use id's inserting database. there way make sure task inserted, supplies inserted id, move onto next one. @ end when complete redirect new page, again put in last success call on supplies portion, redirect on first loop. process generates around 5 tasks, 12 supplies per each task. reading $.when
loop not work. note: after testing ajax calls submitting correctly, 1 field on of them null, , db having issue. counter method below works.
$(document).on("click", "#submittasks", function(e) { e.preventdefault(); var tasks = $('#tasks').find('.box'); var project_id = $('#project_id').val(); tasks.each(function() { var trs = $(this).find('.reqtables').find('.table').find('tbody').find('tr'); var task_definition_id = $(this).find('.task_definition_id').val(); var labor_type_id = $(this).find('.laboramount').children('option:selected').val(); var task_status_id = 1; var qty_labor = $(this).find('.laborqty').val(); var amount_labor = $(this).find('.labortotal').val(); var amount_materials = $(this).find('.mattotal').val(); var amount_gst = $(this).find('.gsttotal').val(); amount_materials = +amount_materials + +amount_gst; amount_materials = amount_materials.tofixed(2); var active = 1; //console.log(div) var task = { project_id : project_id, task_definition_id : task_definition_id, labor_type_id : labor_type_id, task_status_id : task_status_id, qty_labor : qty_labor, amount_labor : amount_labor, amount_materials : amount_materials, active : active }; savetasks(task, trs, project_id); }); }); function savetasks(task, trs, project_id) { $.ajax({ type : "post", url : "<?php echo base_url(); ?>" + "mgmt/project/savetasks", data : task, datatype : "json", cache : "false", success : function(data) { trs.each(function() { var total = $(this).find('input[name="calculatedcost"]').val(); if (total != 'n/a') { var task_id = data; var supply_id = $(this).find('.suppliespicker').children('option:selected').val(); var task_requirement_id = $(this).find('td:first-child').data('id'); var qty = $(this).find('input[name="calculatedqty"]').val(); var cost_per = $(this).find('.costpicker').val(); var delivery_cost = $(this).find('input[name="transport"]').val(); var notes = ''; var qty_actual = ''; var active = 1; var tasksupply = { task_id : task_id, supply_id : supply_id, task_requirement_id : task_requirement_id, qty : qty, cost_per : cost_per, delivery_cost : delivery_cost, total : total, notes : notes, qty_actual : qty_actual, active : active }; savetasksupplies(tasksupply); console.log(tasksupply); } }); } }); } function savetasksupplies(tasksupply) { $.ajax({ type : "post", url : "<?php echo base_url(); ?>" + "mgmt/project/savetasksupplies", data : tasksupply, datatype : "json", cache : "false", success : function(data) { ***** want redirect new page when last 1 of these completes ****** } }); }
here direct solution using code provided. basic concept increment counter supplies processed. once counter reaches total number of supplies, procedure run. see comments throughout.
var totaltasksupplies = 0; var processedtasksupplies = 0; $(document).on("click", "#submittasks", function(e) { e.preventdefault(); var tasks = $('#tasks').find('.box'); var project_id = $('#project_id').val(); tasks.each(function() { var trs = $(this).find('.reqtables').find('.table').find('tbody').find('tr'); var task_definition_id = $(this).find('.task_definition_id').val(); var labor_type_id = $(this).find('.laboramount').children('option:selected').val(); var task_status_id = 1; var qty_labor = $(this).find('.laborqty').val(); var amount_labor = $(this).find('.labortotal').val(); var amount_materials = $(this).find('.mattotal').val(); var amount_gst = $(this).find('.gsttotal').val(); // add number of supplies current task total task supplies totaltasksupplies += trs.length; amount_materials = +amount_materials + +amount_gst; amount_materials = amount_materials.tofixed(2); var active = 1; //console.log(div) var task = { project_id : project_id, task_definition_id : task_definition_id, labor_type_id : labor_type_id, task_status_id : task_status_id, qty_labor : qty_labor, amount_labor : amount_labor, amount_materials : amount_materials, active : active }; savetasks(task, trs, project_id); }); }); function savetasks(task, trs, project_id) { $.ajax({ type : "post", url : "<?php echo base_url(); ?>" + "mgmt/project/savetasks", data : task, datatype : "json", cache : "false", success : function(data) { trs.each(function() { var total = $(this).find('input[name="calculatedcost"]').val(); if (total != 'n/a') { var task_id = data; var supply_id = $(this).find('.suppliespicker').children('option:selected').val(); var task_requirement_id = $(this).find('td:first-child').data('id'); var qty = $(this).find('input[name="calculatedqty"]').val(); var cost_per = $(this).find('.costpicker').val(); var delivery_cost = $(this).find('input[name="transport"]').val(); var notes = ''; var qty_actual = ''; var active = 1; var tasksupply = { task_id : task_id, supply_id : supply_id, task_requirement_id : task_requirement_id, qty : qty, cost_per : cost_per, delivery_cost : delivery_cost, total : total, notes : notes, qty_actual : qty_actual, active : active }; savetasksupplies(tasksupply); console.log(tasksupply); } }); } }); } function savetasksupplies(tasksupply) { $.ajax({ type : "post", url : "<?php echo base_url(); ?>" + "mgmt/project/savetasksupplies", data : tasksupply, datatype : "json", cache : "false", success : function(data) { ++processedtasksupplies; // supplies have been processed if (processedtasksupplies == totaltasksupplies) { // } } }); }
Comments
Post a Comment