I'm creating a webApp in which I show some table data using jQuery and the Flexigrid plugin. In the ideal scenario everything goes ok but I when I return a server-side exception or a validation error on a Flexigrid's ajax request, it does nothing but keep the loading icon and the 'Processing, please wait' message.
Right now you can see this behavior in its sample page, in which the server returns a 404 error but the flexigrid appears like its still loading but never shows any error.
Is there any event I could capture and handle Flexigrid's ajax request errors?
$('#flex').flexigrid({
onError: function(data){
// do stuff here
}
});
Related
We have a JSF 2.2 application using PrimeFaces.
Now, when an error occurs, I check for an AJAX request and deliver a partial response (as shown in BalusC's anwer to this question).
But what is, if there's no server anymore to handle the error, e.g. due to connection loss? At the moment, just nothing happens, leaving the user puzzled.
I found a hint in that question, which works, but I'd like to solve this in a general way, so that all AJAX calls which fail try to redirect to the start page - and then may receive the browser connection error message.
For standard JSF ajax, use jsf.ajax.addOnError() to set the default error handler. E.g.
jsf.ajax.addOnError(function(data) {
alert(data.responseText);
});
See also chapter 13.3.6.2 of the JSF 2.2 spec. You can find all properties of data object in table 14-4 of the JSF spec.
For PrimeFaces 4+, hook pfAjaxError event in jQuery (before 4, just use ajaxError). E.g.
$(document).on("pfAjaxError", function(event, xhr, options) {
alert(xhr.responseText);
});
Just customize it accordingly to show some div in top.
I am developing an application with Symfony2 platform that, at one moment, makes a simple AJAX request on document ready.
jQuery.ajax({
url: 'test.php',
type: 'POST',
data: {
'test': 'test'
},
success: function( response ){
jQuery( 'div#container' ).html( response );
}
});
The problem is that on app_dev.php, where the debug toolbar is loaded, an 500 error is throwed.
More precisely, the AJAX response from the 'test.php' file is received and loaded in the div container, but then, when it tries to load the toolbar, I receive an alert message:
"An error occured while loading the web debug toolbar (500: Internal
Server Error). Do you want to open the profiler?"
If I open profiler, I don't see anything wrong.
If I open the xhr request for the toolbar, a FastCGI 500 error is displayed:
Module FastCgiModule
Notification ExecuteRequestHandler
Handler PHP54_via_FastCGI
Error Code 0x000000ff
If I don't try to make the AJAX request, the toolbar is loaded with no problem.
If I make the request by hand (event on a button) after the toolbar is loaded, again, no problem. If I make the request by hand (event on a button) before the toolbar is loaded the error is throwed.
Notes:
This error occur only on the local machine (with ISS 7.5, PHP 5.4.14). On the production server (IIS server 8.0, same and PHP) the AJAX request is made, and the toolbar is loaded with no problems. I have replaced the php.ini on the local machine with the php.ini from the production server - same problem.
Initialy AJAX request was loading the result of a simple bundle controller method, but then I have tried with a simple PHP file 'test.php', same problem.
I have tried with post and get methods to make the request.
Does anyone have any ideea what goes wrong?
This is not a serious problem since I have multiple options the develop this app, but is bugging me, and I already lost a enough time with this.
PS: if it make any difference, on same machine I have developed an application - no framework - that makes, multiple simultaneos ajax requests.
The following will not fix your error, but provides an alternative way to possibly achieve your need. It seems you want to load asynchronously a part of your website, Symfony2 provides a solution for that: ESI render.
The doc is here: http://symfony.com/doc/current/book/templating.html#asynchronous-content-with-hinclude-js
This method will create an ajax call only then your page will be rendered.
I use Ajax extensively in my JavaScript code. Today I added an Ajax call to a page and nothing happens. The Firefox web console shows a result of "undefined". The exact log entry is:
[11:15:50.733] POST http://mastersw.com/theme/test9.php [undefined 78ms]
(I had to modify the URL to satisfy the editor rules here.)
When I click on the log entry, I see a message dialog with no response. Everything else is correct in the message.
I have checked the Apache logs and there is no sign that the post request got to the server. I use my own JavaScript library Ajax routines. They work everywhere else. I have double checked that the script (test9.php) exists.
I cannot find any documentation on what Firefox means when they say "undefined". Google search returns millions of hits about other things.
The problem seems to be that Firefox is for some reason not completing the post operation and I cannot figure out why.
Update: The JavaScript function invoking the Ajax call was itself being invoked from the onclick handler of an anchor. When I changed the element to a div it worked.
I don't have any idea why Firefox gave an 'undefined' for the post. Chrome complained about an invalid header "Content-Length". Changing to a div fixed this as well.
You need to cancel the click event
$("a").on("click", function (evt) {
evt.preventDefault();
//ajax call here
});
I have a simple CORS AJAX call from within AngularJS application with success callback:
$http({method:'POST',url:"http://0.0.0.0:4567/authenticate",
params: {Lusername:scope.Lusername,Lpassword:scope.Lpassword}})
.success(function(){alert("Success")})
When used in Safari it works fine: returns expected JSON object and shows the alert box. However in Firefox, although the JSON object is returned properly the success callback is not triggered.
Any idea why?
Make sure you handle the OPTIONS request in the server. If it returns 404 then Firefox wont call the next request (in your case the POST mentioned above).
Try this with last version of AngularJS:
$http.post("http://0.0.0.0:4567/authenticate", {
Lusername: $scope.Lusername,
Lpassword: $scope.Lpassword
}).success(function(data, status, headers, config) {
alert("Success");
});
How do I get more information about the errors in my Ajax requests?
When error occurs in Django during a normal HTTP request, Django shows a descriptive error page with exception details.
However, when error occurs during an AJAX request, I just know the HTTP error code and that's it. I'd like to know as much details as I learn from a Django error page.
Handle errors within your ajax request and use responseText to get the response text and put it into an empty div that you have created for that.
For example:
$.ajax({
url:"{% yourView %}",
dataType: 'json',
success: function(jsonData){
alert("Hooray!");
},
error: function(jqXHR, textStatus, errorThrown){
$('.errors_div').html(jqXHR.responseText);
}
});
The django error page will be rendered into div class=errors_div
Your web server's error log will contain additional information about any uncaught exceptions.
Use Firebug. In Console you'll see the AJAX request, just right click -> Copy Response Content and save that as an HTML file.
Why not access the url directly in your browser's address bar so you see a normal traceback?
Wrap it in another view to change the MIME type to text/html.
I also often have a view that wraps the JSON output in a html tag so the Django Debug Toolbar works correctly.