Как отправить ajax один за другим с помощью одной кнопки отправки?

Я создал код, который вызывает сообщение ajax. Когда-то порядок процесса прав, когда-то нет. Я хочу, чтобы пост ajax всегда имел правильный порядок, от функции 1 до функции 4. Каждая функция имеет другое значение формы, поэтому мне действительно нужно ее исправить. Может ли кто-нибудь заглянуть в мой код?

<script> $(document).ready(function () { $('#unggah<?php echo $mhs?>').submit(function (event) { //FUNCTION 1 this.reset(); $('#loading<?php echo $mhs?>').show(); var formData = { 'tahun': $('input[name=tahun<?php echo $mhs?>]').val(), 'jurusan': $('input[name=jurusan<?php echo $mhs?>]').val(), 'posisi': $('input[name=posisi1<?php echo $mhs?>]').val(), 'tabel': $('input[name=tabel<?php echo $mhs?>]').val() }; $.ajax({ type: 'POST', url: '<?=base_url()?>operator_pt/unggah/<?php echo $proses.'_'.$CL?>', data: formData, Async:false, dataType: 'json', encode: true }) .done(function (data1<?php echo $mhs?>) { console.log(data1<?php echo $mhs?>); }) .fail(function (data1<?php echo $mhs?>) { console.log(data1<?php echo $mhs?>); }); event.preventDefault(); //FUNCTION 2 var formData2 = { 'tahun': $('input[name=tahun<?php echo $mhs?>]').val(), 'jurusan': $('input[name=jurusan<?php echo $mhs?>]').val(), 'posisi': $('input[name=posisi2<?php echo $mhs?>]').val(), 'tabel': $('input[name=tabel<?php echo $mhs?>]').val() }; $.ajax({ type: 'POST', url: '<?=base_url()?>operator_pt/unggah/<?php echo $proses.'_'.$CL?>', data: formData2, Async:false, dataType: 'json', encode: true }) .done(function (data2<?php echo $mhs?>) { console.log(data2<?php echo $mhs?>); }) .fail(function (data2<?php echo $mhs?>) { console.log(data2<?php echo $mhs?>); }); event.preventDefault(); //FUNCTION 3 var formData3 = { 'tahun': $('input[name=tahun<?php echo $mhs?>]').val(), 'jurusan': $('input[name=jurusan<?php echo $mhs?>]').val(), 'posisi': $('input[name=posisi3<?php echo $mhs?>]').val(), 'tabel': $('input[name=tabel<?php echo $mhs?>]').val() }; $.ajax({ type: 'POST', url: '<?=base_url()?>operator_pt/unggah/<?php echo $proses.'_'.$CL?>', data: formData3, Async:false, dataType: 'json', encode: true }) .done(function (data3<?php echo $mhs?>) { console.log(data3<?php echo $mhs?>); }) .fail(function (data3<?php echo $mhs?>) { console.log(data3<?php echo $mhs?>); }); event.preventDefault(); // FUNCTION 4 var formData4 = { 'tahun': $('input[name=tahun<?php echo $mhs?>]').val(), 'jurusan': $('input[name=jurusan<?php echo $mhs?>]').val(), 'posisi': $('input[name=posisi4<?php echo $mhs?>]').val(), 'tabel': $('input[name=tabel<?php echo $mhs?>]').val() }; $.ajax({ type: 'POST', url: '<?=base_url()?>operator_pt/unggah/<?php echo $proses.'_'.$CL?>', data: formData4, Async:false, dataType: 'json', encode: true }) .done(function (data4<?php echo $mhs?>) { console.log(data4<?php echo $mhs?>); }) .fail(function (data4<?php echo $mhs?>) { console.log(data4<?php echo $mhs?>); }); event.preventDefault(); }); }); </script> 

вы можете написать отдельную функцию для каждого запроса ajax и вызвать ее из другой функции успеха.

 function callAjax3(){ var formData3 = { 'tahun': $('input[name=tahun<?php echo $mhs?>]').val(), 'jurusan': $('input[name=jurusan<?php echo $mhs?>]').val(), 'posisi': $('input[name=posisi3<?php echo $mhs?>]').val(), 'tabel': $('input[name=tabel<?php echo $mhs?>]').val() }; $.ajax({ type: 'POST', url: '<?=base_url()?>operator_pt/unggah/<?php echo $proses.'_'.$CL?>', data: formData3, dataType: 'json', encode: true }) .done(function (data3<?php echo $mhs?>) { console.log(data3<?php echo $mhs?>); callAjax4() // calling 4th function }) .fail(function (data3<?php echo $mhs?>) { console.log(data3<?php echo $mhs?>); }); } function callAjax2(){ //FUNCTION 2 var formData2 = { 'tahun': $('input[name=tahun<?php echo $mhs?>]').val(), 'jurusan': $('input[name=jurusan<?php echo $mhs?>]').val(), 'posisi': $('input[name=posisi2<?php echo $mhs?>]').val(), 'tabel': $('input[name=tabel<?php echo $mhs?>]').val() }; $.ajax({ type: 'POST', url: '<?=base_url()?>operator_pt/unggah/<?php echo $proses.'_'.$CL?>', data: formData2, dataType: 'json', encode: true }) .done(function (data2<?php echo $mhs?>) { console.log(data2<?php echo $mhs?>); callAjax3(); // calling 3rd function }) .fail(function (data2<?php echo $mhs?>) { console.log(data2<?php echo $mhs?>); }); } 

Вы можете вложить каждый вызов ajax в функцию done () предыдущего. Таким образом, n + 1-й вызов произойдет только после завершения n-го разговора (успешно).

например

 $.ajax({data}).done(function() { $.ajax({data}).done(function() {...}) }) 

Ваш .done( callbacks .done( после успешного завершения запроса.

Сделайте свой второй запрос в .done( обратный вызов 1-го, третий запрос – во 2-й запрос .done( обратный вызов и т. Д.).

Это обеспечит правильный порядок звонков.

… и это то, что они называют пирамидой гибели

Если я правильно понял ваш запрос, вы ищете способ отправить 2 формы на одно нажатие кнопки отправки.

Вы можете добиться этого, отправив вторую форму вручную, используя метод jquery .submit () при успешном вызове ajax первой формы.

Дайте мне знать, если вам нужен обновленный код для этого.