хочет вызвать две функции Ajax на одной форме в CodeIgniter

Question

У меня есть следующие формы в поле зрения и его представившие через AJAX вызов, искать какие-то вещи с сайта:

 <div id="main_form"> 
     <?php $attributes = array('name' => 'analyze', 'id' => 'analyze', 'method' => 'POST'); ?> 
     <?php echo form_open('user/add_domain', $attributes); ?> 
      <div> 
       <input class="text" type="text" placeholder="Website URL to review" id="domain" name="domain" value="" /> 
       <span class="input_bg">client-domain.com</span> 
       <input id="submit_btn" type="submit" class="submit" value="Review Site" /> 
      </div> 

     <?php echo form_close(); ?> 
     </div> 

И я быть_наст следующий код AJAX, который используется для его отправки.

  $(document).ready(function() { 
      $("#analyze").submit(function() { 
       $.ajax({ 
        type: "POST", 
        url: "ajax.php", 
        data: $("#analyze").serialize(), 
        beforeSend: function (XMLHttpRequest) { 
         var overlay = $('<div id="overlay"></div>'); 
         overlay.appendTo(document.body); 
         $("#overlayimage").css("display", "block"); 
        }, 
        success: function (data) { 
         location = "<?php echo $root ?>site/" + data; 
        } 
       }); 

       return false; 
      }); 

Теперь я хочу другой вызов функции AJAX при отправке вышеуказанной формы. это будет функция контроллера и добавит записи в базу данных. поэтому мне нужно запустить две функции AJAX в одной форме. Первый один будет искать с сайта и второй будет контроллер/метод добавления записи в базу данных

    $.ajax({ 
        type: "POST", 
        url: "controller/method",} 

Answer 1

вам нужно добавить второй вызов AJAX после первого AJAX, но перед возвращением.

$("#analyze").submit(function() { 
    formData = new FormData($("#analyze")[0]); 
    $.ajax({ 
     url: "ajax.php", 
     type : 'POST', 
     data : formData, 
     contentType: false, 
     cache: false, 
     dataType: 'JSON', 
     processData: false, 
     beforeSend: function (XMLHttpRequest) { 
      var overlay = $('<div id="overlay"></div>'); 
      overlay.appendTo(document.body); 
      $("#overlayimage").css("display", "block"); 
     }, 
     success: function (data) { 
      location = "<?php echo $root ?>site/" + data; 
     } 
    }); 
      // JUST PUT YOUR SECOND AJAX CALL HERE BEFORE THE RETURN 
    $.ajax({ 
     type: "POST", 
     url: getBaseUrl() + "user/add_domain", 
     data: formData, 
     success: function(data) { 
      // do what ever you want after the controller's method finish 
     } 
    }); 
    //THE RETURN TO CANCEL THE ACTION FOR THAT FORM AND STOP EVERY THING. 
    return false; 
}); 

function getBaseUrl() { 
    var l = window.location; 
    var base_url = l.protocol + "//" + l.host+ "/" + l.pathname.split('/')[1]; 
    return base_url; 
} 

Answer 2

AJAX JQuery называет поддержки цепочки действий, поскольку они реализуют обещания. Чтобы активировать действие, как только какое-либо другое действие завершится, вы можете использовать методы, которые поддерживает обещание, а именно done(), then(), fail() и т. Д. См. promises.

Так что в вашем случае, что вы хотели бы достичь можно было бы сделать, используя обещание, возвращенное $.ajax():

$("#analyze").submit(function() { 
      var promise = $.ajax({ 
       type: "POST", 
       url: "ajax.php", 
       data: $("#analyze").serialize(), 
       beforeSend: function (XMLHttpRequest) { 
        var overlay = $('<div id="overlay"></div>'); 
        overlay.appendTo(document.body); 
        $("#overlayimage").css("display", "block"); 
       }, 
       success: function (data) { 
        location = "<?php echo $root ?>site/" + data; 
       } 
      }); 

      promise.done(function(){ 
       // perform the action after previous has finished 
       $.ajax({ 
        type: "POST", 
        url: "controller/method" 
       }); 
      }); 
      return false; 
     }); 

С другой стороны, как отметил @Alex Андре, вы можете просто добавить второй AJAX вызова в обработчик успеха первого. Это может быть предпочтительным подходом, если вы хотите, чтобы убедиться, что вызов вашего Аякса было успешного, и после его успеха, вы можете продолжить:

 $.ajax({ 
       type: "POST", 
       url: "ajax.php", 
       data: $("#analyze").serialize(), 
       beforeSend: function (XMLHttpRequest) { 
        var overlay = $('<div id="overlay"></div>'); 
        overlay.appendTo(document.body); 
        $("#overlayimage").css("display", "block"); 
       }, 
       success: function (data) { 
        location = "<?php echo $root ?>site/" + data; 
        //second ajax call here 
       } 
      });