I have been looking around the web (obviously in wrong places) to find what is the success and failure criteria for ajax(jquery post) purposes.
For example, let's say I am using ajax to post to a php script. The script can return:
exit 0
exit 1
jason array
return
etc...
When would those return values be translated into success and when into failure?
As you may already know $.ajax() supports beforeSend, success, error and complete callbacks.
So what should my script send in case of success and in case of failure for the appropriate callback to be triggered.
Ben is right, but I'll expand a little.
jQuery determines success or failure based on the HTTP response code of the page being called. Note that this is not the same as the content in the response that is sent back.
As an example, let's say that you have your PHP script located at http://url.com/script.php
When a user hits that site, they are going to get a response from the server. That response could be a JSON object, it could be an HTML page, or it could be an empty response. In all of these cases, the response code would likely be 200. A 200 response code means that the server understood the request, accepted it, and sent something back.
Now let's say that a user tries to hit http://url.com/notascript.php
The server doesn't know what to do with that (assuming that notascript.php doesn't actually exist). It fails the request, and sends back a response -- probably with the response code 404 (or something else in the 4xx range).
So if you know the actual URL, then how does jQuery's error handler ever get called?
Well, let's say that your AJAX call is trying to load a blog post, and tries to make a call like this: http://url.com/post?id=5. If your PHP script determines that there is no blog entry with an ID of 5, then you probably shouldn't send back a successful response. Rather, a 4xx response would be more appropriate. And PHP has a built-in function for that:
<?php
http_response_code(404);
?>
Now, the response will be read by jQuery as a failure, and the error handler will be called.
Further reading:
http_response_code() function
RFC2616, which defines HTTP response codes
REST
I believe it's based on header codes (ie, 200 - success). You can send your own special errors back though e.g. How to receive error in jQuery AJAX response?
You shouldn't make Ajax error if you have a problem with the code in the page being requested. As far as Ajax is concerned, so long as the page physically is successfully requested, it has performed properly. Any errors within the page being requested are not a fault of Ajax, so should be handled by your code after a successful load of that page. Using custom headers as in the link above will make it easier for you to do that.
Ajax requests page --> Page loads & no errors --> page request successful --> You Perform result error checking
vs
Ajax requests page --> Page loads & has errors --> page request successful --> You Perform result error checking
As you can see, it doesn't matter if the page being requested has errors, it's not an Ajax fault, so shouldn't be treated as one.
You can select one pattern that always printed for success, other cases like ajax failure can be known via AJAX itself (HTTP response code): for example:
You always print: yes for success and if correct result found
You always print: no for success and if incorrect result found
If none of above returned then its ajax failure or if the script prints another word then you need to check your PHP.
Related
I'm pretty inexperienced with jquery. My code is
function edit(uID){
var php = "body/weekly_deals.php";
var data = {"edit" : "post is here"}
$.post(php, data,function(response){
console.log(response);
});
}
This is being defined on a WeeklyDeal.php. Now, on my body/weekly_deals.php page, I var_dump($_POST['edit']) and I'm getting NULL, however in the console.log, I'm seeing the value "post is here" string? So, I'm confused. How can it be there, but not be there at the same time?
I suspect you are misunderstanding how this works.
I var_dump($_POST['edit']) and I'm getting NULL
The way you phrased your question, it sounds like you are not seeing that null in your console.log(), which is what would happen if you had the var_dump and called it with ajax. Instead, it sounds like you are loading weekly_deals.php directly in the browser and, since that is a GET request, not a POST request, and no parameters are being passed, it comes back empty.
however in the console.log, I'm seeing the value "post is here" string
Right, because javascript is making an HTTP request using the POST method and passing a parameter.
I think you may be confused about how an HTTP request works. To break it down, you have a resource which comes as a URI -- you know this as the web address. You can ask it questions in a few different ways -- GET, POST, PUT, etc. A web browser, when navigating to a page, issues a GET request to the resource. The web server returns the response and renders it.
When you make an AJAX request, you are doing something very similar as far as the request life cycle is concerned. When you make the request, the server renders the response and sends it back. That is why your console.log() has what you expect to see -- because AJAX made the request the server side expected to get. When you navigate to the page directly in the browser, it is the wrong type of request and thusly you see the wrong response.
i've been doing a lot of ajax scripts and every time something seems to be different.
in this case i have a form that i want to post
<form id="sss">
<input id="qqq"/>
<input type="submit" id="s" href="Search!"/>
</form>
<div id="rrr"></div>
and
$('#s').click(function(){
$.ajax({
url: 'foo.php',
data: {
query: $('#q').val()
},
success: function(data) {
$('#rrr').html(data);
}
});
return false;
});
and
if(isset($_REQUEST['query'])){
print_r($_REQUEST['query']);
}
what happens is that in <div id="rrr"></div> gets loaded the print_r($_REQUEST['query']); and all the rest of the html page.
i only want to return $_REQUEST['query']
weird!?
any ideas? What this success: function(data){} actually means?
Thanks
If you are requesting the same page that you are current displaying, then your if statement doesn't stop processing, so the rest of the page is returned as well. You either need to die() afterward, or (recommended) create a separate page entirely dedicated to handling AJAX requests. Here's an example of how to properly stop processing:
if (isset($_REQUEST['query'])) {
print_r($_REQUEST['query']);
die(); // stop processing.
}
In regards to your second point, I think you might be misunderstanding the technical details of what's actually happening here:
Client requests foo.php from server. Server executes foo.php according to the logic in the page, and sends response output to browser. Browser renders the page.
Client sends AJAX request (which is nothing more than a request that happens asynchronously, i.e., separately from the browser loading a page) to foo.php?query=...
Server executes foo.php?query=... (just like it did in step (1)!), which causes the first if to trigger before returning the rest of the html in response, so the same page is returned except with the query output at the top (Try going directly to foo.php?query=... in your browser and I think you'll see what I mean).
However, instead of the response being rendered in the browser, since it was an AJAX request, the response is captured into a variable, data.
The callback function success(data) is executed, passing the exact output returned from the server as-is from the AJAX request (i.e., the variable contains the same as viewing the source of foo.php?query=... in your browser), which is then processed according to your logic. In this case, you are dumping the contents into a div, so you see the output correctly.
Please take a moment to install and run Fiddler, so you can see the exact data that is flowing back and forth as you load the page in your browser, and then watch what happens as you make an AJAX call. Perhaps it will make the data flow and results you are getting much clearer.
Hope this helps!
A quick question of perhaps a more speculative nature. I've been getting heavy into jquery lately to handle all the ajax in my web apps.
Right now I'm building a bidding system in PHP that makes heavy use of mod_rewrite. I'm using jQuery with a confirm dialog to send an Ajax request that will spend some of the user's predeposited credits on a bid. The ajax request to spend is sent with the cost as a post parameter to a PHP controller that spends the users credits and then echos the output, which jQuery then places back into the document.
It's working fine, but what I'm wondering is if there is a better way to make jQuery handle the refusal of the purchase if the user has insufficient credits. Right now I have the php answering with an echo that displays this message with a link to the make a deposit page... but I'd rather have a redirect happen automatically.
Is there some way my jQuery script could be notified with the boolean of success or failure before .load finishes, and then redirect in the case of failure? Possibly through HTTP headers determining the handling? The only way I could think of is to place a true or false in an html element that gets check in the callback after .load() and in the case of a false perform a redirect.
Thanks and sorry for the explanation length.
If every bidding attempt requires going somewhere else, why use AJAX in the first place?
Anyway, if you look at jQuery's API documentation you'll see that load() is not the only function available. Most of the are simplified versions of ajax(); if you use this one, you can control all possible events right from there. No need to mess with HTTP headers!
I suggest you redesign your server-side script so it returns a JSON object. Then, you can send back all the different types of responses:
{
biddingSuccessful: true,
linkToDepositPage: "http://example.com",
textToDisplay: "Your bidding was successful"
}
Use the lower level $.ajax call to have full maximum control over the request. Ideally, instead of sending a success 2xx response, send an error response which will automatically get sent to your error callback.
$.ajax({
url: '..',
success: function() {
// if it gets here, then assume credits were used
},
error: function() {
// some error happened
// if error was about insufficient funds, then redirect
}
});
From the server, send the success response as you are doing right now. However for errors, change the response header, and send a JSON object or plain text indicating what the error was. And there is a header for exactly what you are looking for. It's 402 - Payment Required :)
header('HTTP/1.1 402 Payment Required');
send a JSON object as response with more details:
{
status: 'error',
reason: 'Insufficient Funds',
balance: '$2.78',
amountRequested: '$3.50'
}
For the updated comment, you need to use a closure (better than global variables :)
Suppose the outer function gets the element name/ID, wraps that value through a closure in the success callback. Please let me know if this is not what you intended.
function makeAJAXCall(elementName) {
$.ajax({
success: function(...) {
// elementName is available here through a closure
alert(elementName);
}
});
}
if the callback function is like "function (data) {" then you could return "NSF" or something like that, and simply compare 'data' to 'NSF', and do the redirection with window.location
How do ajax know whether it failed or succeeded if server side doesn't echo anything back?
$.ajax(error:..,success:..)
I met with this exception in my test:
uncaught exception: [Exception...
"Component returned failure code:
0x80040111 (NS_ERROR_NOT_AVAILABLE)
[nsIXMLHttpRequest.statusText]"
nsresult: "0x80040111
(NS_ERROR_NOT_AVAILABLE)" location:
"JS frame ::
http://localhost/script/tab.js ::
anonymous :: line 69" data: no]
The server side code is :
$id = process();
And for the purpose of testing,I have exit() in process();
Is that the reason for this exception?If so,why?
EDIT
I looked over to the line that cause exception,it's the error handling function of $.ajax()
error:function(XMLHttpRequest, textStatus, errorThrown){
alert(XMLHttpRequest.statusText);alert(textStatus);alert(errorThrown);
}
Anything wrong here?
The httprequest also returns a status such as 200 == ok, 404 == not found, 12152 == connection closed by server and so on..
Just read up on the status id's what they mean so you can look for them. you can also for debugging reasons just write out myhttprequest.status to the document and it shows what status it returned.
This depends on the status code the request returns. A successful request returns a status code in the range of 2xx, an error is in the range of 4xx of 5xx.
For more information see Wikipedia: List of HTTP status codes.
It would still get a response from the server, with the data part of it being empty. If it got no response at all, that would be an error.
http://docs.jquery.com/Ajax/jQuery.ajax#options
Give an option for success and error These functions will be called after the call is made.
There are four possible scenarios that you could get:
the server isn't there or refuses the connection (this is identifiable by the sockets library that the browser uses, which will report the connection failure)
the connection works and the server returns a non-success error code - this comes back in the header. Indeed, the request can succeed (200 code) even with an empty body, that's perfectly valid
the connection comes up but the server fails to respond - I'm not clear on the details of this, but i'd expect the JS to eventually time out because no response was received and return a failure based on that.
the connection comes up but the server responds incorrectly (e.g. no headers) - the JS implementation should return this as an error.
In any case, all the error scenarios are handled by the Javascript core's XMLHttpRequest implementation - jQuery just wraps it up with slightly tidier interface.
In your case (now you've provided more information) I would recommend that you use Firebug to see what the server response to your request is. That said, you shouldn't be getting an exception for anything inappropriate from the server, the JS should call the same error callback for all the above cases.
are you missing { } ?
$.ajax(error:..,success:..)
should be
$.ajax( { error: function( ){ } } );
if that's it, sorry dude, that would be annoying to have spent that much time on, haha
I fixed this by specifying a timeout in my ajax call. The ajax timeout was just giving up after X amount of time. Even though the page ended up returning data, the ajax object just gave up and bailed, but threw this error.
i have a page performing the following ajax request when a button is pressed.
normally i get a json object back and it works fine, i have noticed on intermittent requests (usually only the first request from that page), i get back a 200 success code with a blank page.
if i reload the html page, then press the button again it works fine straight afterwards.
by intermittent i mean i can't replicate the issue at will, but it is happening regularly enough that i need to do something about it
i am just wondering if it is most likely an ajax or in particular a prototype problem or a server side issue (i am using debian/apahce/php)
what can i try to track down the problem ?
new Ajax.Request( url,
{
method:'post',
parameters: $('TeamForm').serialize(true),
onSuccess: function(transport) {
// do stuff
},
onFailure: function(transport) {
// display error
}
});
This isn't a solution to your problem but a workaround -- in the meantime, you could detect if the response's responseJSON property is NULL, and if so, log the error and resubmit the request. That way at least the second request should go through. The easiest way to handle this might be to throw a custom object from your onSuccess handler allowing your onFailure handler to catch it and resubmit.
Based on the example you provided, the only source of concern I can see with the javascript is the $('TeamForm').serialize(true); statement. Are you sure that the TeamForm has well formed data, and your PHP backend is handling this appropriately?
Check your PHP code for any trailing whitespace. You should not end your PHP files with a closing tag.
e.g.
<?php
class Foo {
}
?> //There is a space after this closing tag!
Would result in the hidden space being sent to your browser. It is valid syntax (and recommended) to leave the closing tag off of a pure PHP file:
<?php
class Foo {
}
Also check your code for any echo's or print's that may send output to the browser. Also check your display_errors setting, as an error message could result in data being sent to the browser as well.
I'd put 99:1 odds on the problem being server-side.