2

I wander how send post form data in json format via ajax with JQuery dynamically? For example I'm coding something like this in JQ:

$.post("test.php", { func: "getNameAndTime" },
    function(data){
      alert(data.name); // John
      console.log(data.time); //  2pm
    }, "json");

and that's good, but in live apps often need to send huge form data and user can dynamically change the fields, so I don't know how many func1, func2, func3 or even func[] will be sent. The q is how to do this dynamically, in old world of an AJAX I could done it by serealizing the form and send to the server. Thanx in advance.

Arthur Kushman
  • 3,449
  • 10
  • 49
  • 64
  • Thanks to Utkanos (+1 point up) for the solution he suggested to name fields with a class and pass it then through $.each JQ function, but can we do this without dependence of a class or id, just send whole form? If not, can We send a multiple form items like input name="email[]" etc? – Arthur Kushman Jul 14 '12 at 12:14

2 Answers2

5

Yes I can send all the data to the server and in any case it will worked well, example:

$(function() { // on document load
$('#email_form').submit(function() { // set onsubmit event to the form
  var data = $('#email_form').serialize(); // serialize all the data in the form 
  $.ajax({
    url: 'testJson.php', // php script to retern json encoded string
    data: data,  // serialized data to send on server
    dataType:'json', // set recieving type - JSON in case of a question
    type:'POST', // set sending HTTP Request type
    async:false, 
    success: function(data) { // callback method for further manipulations             
      for (key in data.email) {
        alert(data.email[key]);
      }

    },
    error: function(data) { // if error occured

    }
  });
  return false;
});

});

Arthur Kushman
  • 3,449
  • 10
  • 49
  • 64
  • 16
    This doesn't send the form data in json format at all. `dataType: json` only tells the ajax request that it expects the return data to be json. – 1615903 Nov 06 '14 at 12:44
3

It is possible to build up dynamic data for an AJAX request but clearly you'll need to know the logic for retrieving that dynamic data. You don't describe this in your question, so in the below example I'm assuming it's based on the number of .user_input fields in the form (which could be 2, or 10, or whatever). The data is then comprised of field name + field value.

The point is to show dynamic collection of data, that's all.

var ajax_data = {};
$('.user_input').each(function() {
    ajax_data[$(this).attr('name')] = $(this).val();
});
$.post('some/url.php', ajax_ata); //etc
Mitya
  • 33,629
  • 9
  • 60
  • 107
  • and one more thing, what should I do if there is multiple fields like name="emial[]"? I think this method won't work for that purpose. – Arthur Kushman Jul 14 '12 at 11:58
  • 1
    As I said in my answer, the means of compiling your data is up to you and I can't predict that. I assumed a contrived example where you just wanted to gather up the values from `user_input` fields. I was simply showing that, yes, you can build dynamic AJAX data. Я не русский но может кажется так, из-за моего юзернейм. Я в России жил в течении 4 лет. – Mitya Jul 14 '12 at 12:06
  • 1
    Охереть, ты Англичанен-программист, который жил в россии 4 года - круто =) Yeah, Your user name told me about Russian probabilities. – Arthur Kushman Jul 14 '12 at 12:08