jquery ajax posting directory

I am trying to post an ajax request like so:

$.ajax({
            url: 'directory/file.php',
            type: 'POST',
            data:   'param1=' + param1 + '&param2=' + param2,
            success: function(response){
                $('#content').html(response);
            }
}); 

The POST request does not work when I use this code snippet, but if I move the file up one directory and use:

$.ajax({
            url: 'file.php',
            type: 'POST',
            data:   'param1=' + param1 + '&param2=' + param2,
            success: function(response){
                $('#content').html(response);
            }
}); 

Then it magically works.

I have tried:

/directory/file.php and fullpath/开发者_如何学运维directory/file.php

I also included the full path when I moved it up one directory and it still worked.

I must be over looking something simple, but I can't figure it out.

---

I had the same problem recently. After playing around using the recommended Firebug above (cheers, btw!), I realised that the problem lied in the .php file and not the in the javascript. When I moved the php-file one folder down, it was no longer referring to the same folders and files as it did one level up.

Hope this spares someone out there from the headache I've had the last few hours!

---

There's nothing obviously wrong with this block of code, so the problem must be elsewhere. When working on AJAX, if something isn't working right, here's the set of steps I generally take to figure out where the problem is. A lot of this is rather obvious, but I've found that taking nothing for granted and systematically verifying each in turn will generally help me resolve the issue quickly. Finally, I'll generally reference using Firebug because that's my tool of choice, but you could accomplish most of this with other tools just as easily.

First, when working with AJAX code, I always have Firebug open. Load the page, and make sure there are no JavaScript syntax errors on the page itself that may be preventing event handlers from being wired, etc.

Next, I'd modify the code you gave to be the following:

alert('Running AJAX request');
$.ajax({
            url: 'directory/file.php',
            type: 'POST',
            data:   'param1=' + param1 + '¶m2=' + param2,
            success: function(response){
                alert('Response received: ' + response);
                $('#content').html(response);
                alert('Document modified.');
            },
            error: function(req) {
                alert('Error: ' + req.status);
            }
}); 

Now, when you trigger your AJAX request, you should get plenty of information that'll tell you where in the process something got tripped up.

If you don't see 'Running AJAX request,' check the event handlers that are supposed to be triggering your request. If you see 'Error: ,' then verify that the request URL was as you expected and that manually browsing to that URL gives the expected result.

If you see 'Response received: ', but the response text isn't what you expect, again, try browsing to the page manually in your browser. If there's a difference between what you see in the browser and what the AJAX request is seeing, use Firebug's Net tab to check for differences between the parameters your browser and the AJAX request are sending (e.g. perhaps you need to append a session identifier in the AJAX request).

If all of that works, but the document modification doesn't happen as expected, then use Firebug's DOM tab to verify that document IDs are matching between the DOM and the script, and inspect the DOM to see what changes are actually happening as a result of your $('#content').html(response) line.

---

Try to use the "error"-callback of the $.ajax method and return the status code in it.

$.ajax({
            url: 'directory/file.php',
            type: 'POST',
            data:   'param1=' + param1 + '&param2=' + param2,
            success: function(response){
                $('#content').html(response);
            },
            error: function(req, status, error) {
                       window.alert( req + "\n" + status + "\n" + error );
                   }
}); 

There could be a problem with your chmod on that directory, which needs to be at least 755 (everything, but only group and owner can write). In that case, a 403-HTTP-Status-Code should be returned by jQuery.

This could help finding the mistake.

---

I've tried your code using jquery 1.4.2 It worked fine. So except maybe you don't have access rights to that folder or you mixed up the directory structure one way or the other.

Try pasting the url in you $.ajax function in your browser and see if it works.

Cheers