Question

When i submit a jquery ajax request without the data value, it works, when i submit it with the data value, nothing happens. I check if it works using firebug. I think its a simple mistake but i cant seem to figure it out. Please Help.

Here is the Jquery Code

var inputString = $("something").val();
var suggestions = $.ajax({
    url: "temp.php",
    type: "POST",
    data: {valueInput : inputString},
    dataType: "html"
});

temp.php just has some simple code since I’m testing:

    echo "We got sumn here";

another thing is the suggestions variable is empty, any ideas?

Answer 1

You can try:

    data: 'valueInput=' + encodeURIComponent(inputString),

Update

suggestions is being set to the jqXHR object returned from the $.ajax() function. If you want to do work on the server-response then you need to set a success callback somehow. Here are two ways:

var inputString = $("something").val();
$.ajax({
    url      : "temp.php",
    type     : "POST",
    data     : 'valueInput=' + encodeURIComponent(inputString),
    dataType : "html",
    success  : function (serverResponse) {
        //you can now do work on the server-response, it's stored in the serverResponse variable
        alert(serverResponse);
    }
});

OR

var inputString = $("something").val(),
    suggestions = $.ajax({
    url      : "temp.php",
    type     : "POST",
    data     : 'valueInput=' + encodeURIComponent(inputString),
    dataType : "html"
});
$.when(suggestions).then(function () {
    //this is your callback function
});

I suggest the first method, the second is more advanced and is really only helpful if you want to wait for a set of AJAX requests to complete before doing something.