Использование AJAX для отправки динамически заполненной формы в два местоположения

Я отправляю форму, которая должна будет отправиться в 2 разных местах. Форма скрыта и автоматически заполнена .valметодом jquery . Как я напишу ajax, чтобы отправить это в 2 разных местах? Могу ли я сделать это, если у меня нет доступа к настройкам на моей стороне?

Вот форма, которую я представляю

<form action="x" method="post" class="form-inline">
      <input type="hidden" name="players_name" class="form-control" id="playersFullName_submit">
      <input type="hidden" name="players_email"class="form-control" id="playersEmail_submit">
      <input type="hidden" name="players_score" class="form-control" id="playersScore_submit">
      <input type="hidden" name="redirect_url" class="form-control" id="redirectURL_submit" value="x">
      <input id="submit endGame" type="submit" class="btn btn-default" value="Submit Your Score">
    </form>

Вот мой jquery, заполняющий это

 $(function () {      // fill form fields
   $('#playersFullName_submit').val(playersFullName);
   $('#p_name').append(playersFullName);
   $('#playersEmail_submit').val(playersEmail);
   $('#dateSubmitted').val(submitDate);
 });

Вот как я думаю, мне нужно настроить его

$.ajax({
           type: "POST",
           url : "url1.com",
           data: {},
           success: function(msg){
                 // get response here  
               }
           });

$.ajax({
           type: "POST",
           url : "url2.com",
           data: {},
           success: function(msg){
                 // get response here  
               }
           });

Нужно ли мне вводить что-либо в <form>, или он будет вытаскивать его из моего data?

javascript,jquery,ajax,forms,

1

Ответов: 4


1 принят

Вам нужно получить данные формы и ввести ее в вызовы AJAX в dataсвойстве. Вы можете сделать это с помощью serialize()метода JQuery :

// Get your reference to the form:
var theForm = document.getElementsByTagName("form")[0];

$.ajax({
           type: "POST",
           url : "url1.com",
           data: $(theForm).serialize(), // <-- Inject serialized form data
           success: function(msg){
                 // get response here  
               }
           });

$.ajax({
           type: "POST",
           url : "url2.com",
           data: $(theForm).serialize(), // <-- Inject serialized form data
           success: function(msg){
                 // get response here  
               }
           });

0

b / c, вы отправляете ajax не форму, вам необходимо предотвратить отправку формы формы, объявите серверный маршрут в ajax.

$('#submit_btn').on('click', function(e) {

    e.preventDefault(); // you need this so the form don't submit

    $.ajax({
       type: "POST",
       url : "url1.com",
       data: {},
       success: function(msg1){
             var msg1; 
           }
       });

    $.ajax({
       type: "POST",
       url : "url2.com",
       data: {},
       success: function(msg2){
             var msg2; 
           }
       });
});

0
$.ajax({
           type: "POST",
           url : "url1.com",
           data: $('.form-inline').serialize(),
           success: function(msg){
                 // get response here  
               }
           });

$.ajax({
           type: "POST",
           url : "url2.com",
           data: $('.form-inline').serialize(),
           success: function(msg){
                 // get response here  
               }
           });

0

В случае, если вам приходится отправлять на многие URL-адреса ...

var theForm = document.getElementsByTagName("form")[0],
    urls = ['url1.com','url2.com', ....];

$.each(urls, function(index,value){ 
   $.ajax({
      type: "POST",
      url : value,
      data: $(theForm).serialize(),
      success: function(msg){
           // get response here  
      }
   });
});
JavaScript, JQuery, AJAX, формы,
Похожие вопросы