JQuery Ajax error

Question

I am posting some form values through ajax to a PHP script. The PHP echoes 1 if it's successful and 2 if not.

The PHP seems to be working ok but I am being redirected to the url in the javascript and shown the number 1 on a blank page instead of it being echoed back to the ajax request.

This is my javascript, can anyone see where I am going wrong?

$(".save").click(function() {
var area = $("input#area").val();  
var january = $("input#january").val(); 
var target = $("input#target").val();
var ach = $("input#achieved").val(); 
var comments = $("input#comments").val(); 
var token = "<?php echo $token; ?>";
var dataString = 'area='+ area + '&january=' + january + '&target=' + target + '&achieved=' + ach + '&comments=' + comments + '&ci_token=' + token;
  $.ajax({
    type: "POST",
    url: "review/update-review/<?php echo $yr; ?>",
    data: dataString,
    success: function(msg) {

        if(msg == 1)
        {
            alert("Your review has been updated.");
        }
        else
        {
            alert("There was a problem updating your review. Please try again.");
        }

    }
  });
  return false; });

Answer 1

I think the problem may be down to the format of your data parameters. for

type : "POST"

then for

data : "{param1: 'param1', param2: 'param2'}"

do you have a tool like fiddler to view the communications between your browser and server. if not i would recommend downloading fiddler (it's free). it will give you a lot of insight as to what is actually happening behind the scenes and can give invaluable information about what might have gone wrong with an ajax style post.

Answer 2

The code looks pretty much fine to me, including the syntax. Still some possibilities arise, which are:-

• The URL for executing the PHP code, which you are using in the example ("review/update-review/<?php echo $yr; ?>"), may be incorrectly given with reference to your current page.
• The variables which you are using it here to capture the values of the INPUT elements, may be producing some extra special characters (like "&") which may lead to erroneous processing, resulting in the JavaScript problem.

Hope it helps.

Answer 3

For starters if(msg == 1) will not be == 1 because what your fetching is a string so it would b if(msg == '1').

Where you have

var dataString = 'area='+ area + '&january=' + january + '&target=' + target + '&achieved=' + ach + '&comments=' + comments + '&ci_token=' + token;

Change that to an object like so:

var dataObject = {
    area : area,
    january : january,
    target : target,
    achieved : ach,
    comments : comments,
    ci_token : token
}

and then change it in the ajax request to dataObject

Debug

• Firefox: firbug.
• if your using chrome hit Ctrl+Shift+J to open the javascript console and debug. look out for all the heaDers and data your sending and you can use console.log(varaible) to track the values of a variable.