CODEWITHSUNDEEP
javascriptphpjqueryajax
Armitage2k
Armitage2k

Reputation: 1274

AJAX - submit multiple POST data

I am desperately trying to submit multiple POST variables via AJAX, but just cant get manage to get the formatting right... Problem is that I have both a hardcoded / written action=problem_lookup variable and a dynamic field input as $(this).val and just cant manage to get both into one data string...

this works well:

data: 'problem=' + $(this).val(),

This does not:

data: { action: 'problem_lookup' , problem: $("problem").val() },
data: { action: 'problem_lookup' , problem: $(this).val() },
data: { action: problem_lookup, problem: $(this).val() },

I tried numerous formats from other threads and looked at the official jquery manual, but cant seem to get this figured out. Any help is appreciated.

EDIT:

full script below, tried the solutions posted so far but no success. $("problem") is a <select> field (with Select2 running) hence shouldnt cause me so much frustration, especially since the original approach with data: 'problem=' + $(this).val(), works fine.

$(function () {
    $('#problem').change(function () {                      // on change in field "problem"

    var data = {
        action: 'problem_lookup', 
        problem: $("problem").val()
    }

        $.ajax({                                            // launch AJAX connection
            type: 'POST',                                   // via protocol POST
            url: 'ajax.php',
            //data: 'problem=' + $(this).val(),             // send $_POST string
            //data:"{'action':'"+action+"','problem':'"+$(this).val()+"'}",
            //data:"{'action':'problem_lookup','problem':'"+$(this).val()+"'}",
            //data: { action: 'problem_lookup' , problem: $("problem").val() },
            //data : data_string,
            data: $.param(data),
            dataType: 'json',                               // encode with JSON
            success: function (data)
            {
                // do something
            },
        });
    });

});

Upvotes: 1

Views: 712

Answers (3)

Massimo Petrus
Massimo Petrus

Reputation: 1891

An issue is in the 

          $("problem")

Jquery call.

If.problem is a css class try with

          $(".problem")

if problem is a css id try with 

       $("#problem")

For posting arrays of object you can build data as an object containing arrays, changing a little bit your structure. Something like this

 Var obj={};
 obj.postData=[];
 obj.postData.push(/*your first object here*/);
 ...
 obj.postData.push(/*your n-th object here*/);


    $.ajax({    
         .....
        data:obj;
        ......
     });

Upvotes: 1

Thamilhan
Thamilhan

Reputation: 13323

You need to specify your data variable first like this:

var data = {
    action: 'problem_lookup', 
    problem: $("problem").val()
}

In AJAX serialize your data using $.param,

data: $.param(data),

Note: Twice check if $("problem").val() is correct. If problem is a class, you need to specify like this $(".problem").val() or if it is ID, $("#problem").val()

Upvotes: 1

YugoAmaryl
YugoAmaryl

Reputation: 443

Try the FormData() FormData. 

var data = new FormData();
data.append('action', value);
...

Upvotes: 1

Related Questions