AJAX callback in Inter Explorer - ajax

I have a question about AJAX.. I am using AJAX for my javascript in calling php file,
how ever I noticed that when I run the program in IE callback comes in twice which
gives me more results than expected while callback comes in in firefox only once..
I want to have just the one reply from callback..
this.doPost = function(param) {
/// make a HTTP POST request to the URL synchronously
req.open("POST",url, true);
...
this is the call..
Do you know what is wrong?
Thanks.

Depending on how you actually perform the AJAX call and what you do in the callback, you can run into issues - see for example this thread for similar issues:
How to execute a page ,that contains JS ,in AJAX ,using innerHTML?
I suggest you try some proven library instead of using AJAX on the low level. For example, using jQuery you can use $.ajax, see e.g. the examples in jQuery documentation:
http://api.jquery.com/jQuery.ajax/
or some of many other examples you can find on the Net, such as this:
http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax-calls-with-jquery/

Related

General handling of AJAX call error on client side

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.

Load data from ajax request (json) on startup in AngularJs

I have this simple page that just needs to show contents that is loaded from an external url (ajax request, response in json format)
I should say I'm a AngularJS newbie.
I've googled a bunch and found different ways of doing this and couldn't manage to determine which is the correct/simple/up-to-date way to achieve this.
My 2 challenges -
Making the AJAX request run on startup (I can load the page before that happens and just load the contents one the ajax request finishes. Maybe show a 'Loading..' indicator)
Doing a ajax request correctly.
Here is my attempt. I know that the ajax request is never made because its not setup correctly.
You are getting into .error function:
http://jsbin.com/oDUsuVA/3/edit
For jsonp your response should be something like:
callback([
{
"title":"License Title 1",
"licenseUrl":"http://cnn.com",
"licenseText": " test"
}]);
Edit:
You can simply do .get() request too, but if you had to use jsonp request interface, you would have to correct response.
A Jsonp request always wraps the logic into a json callback wrapper function.
I just did $http.get instead of your $http.jsonp and it did work for me.

Firefox Ajax post web console summary says 'undefined'

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
});

HTMLUnit does not process jsonp request

I am trying to crawl my GWT app with HTMLUnit, but for a certain page the desired content is not returned. The GWT page contains a dynamically added javascript which makes a jsonp request to a gae server. I already debugged the server code, and the breakpoint is hit, but at this time the htmlunit code is already finished and the returned content is not complete.
I almost tried all suggested solutions available in stackoverflow, but without any success.
Here is the jsonp request.
http://30.tripstorekrabi.appspot.com/activity?&callback=__gwt_jsonp__.P0.onSuccess
On other pages I use exactly the same kind of call, and there it works fine.
Can anyone help me?
I found a workaround in my GWT code:
Now the jsonp request is executed in a deferred scheduled command:
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
#Override
public void execute() {
activityRegistry.loadActivities(new AsyncCallback<Result>() {
}
Now the javascript function is processed from htmlunit and the desired content is showed.

Cross domain javascript ajax request - status 200 OK but no response

Here is my situation:
Im creating a widget that site admins can embed in their site and the data are stored in my server. So the script basically has to make an ajax request to a php file in my server to update the database. Right? Right :)
The ajax request works excellent when i run it in my local server but it does not work when the php file is on my ONLINE server.
This is the code im using:
var url = "http://www.mydomain.net/ajax_php.php";
var params = "com=ins&id=1&mail=mymail#site.net";
http.async = true;
http.open("POST", url, true);
http.onreadystatechange = function() {
if(http.readyState == 4 && http.status == 200) {
//do my things here
alert( http.responseText );
}
}
http.send(params);
In firebug it shows: http://www.mydomain.net/ajax_php.php 200 OK X 600ms.
When i check the ajax responnseText I always get a Status:0
Now my question is: "Can i do cross-domain ajax requests by default? Might this be a cross-domain ajax problem? Since it works when the requested file resides in my local server but DOESN'T work when the requested file is in another server, im thinking ajax requests to another remote server might be denied? Can you help me clear on this?
Thanks..
Cross-domain requests are not directly allowed. However, there is a commonly-used technique called JSONP that will allow you to avoid this restriction through the use of script tags. Basically, you create a callback function with a known name:
function receiveData(data) {
// ...
}
And then your server wraps JSON data in a function call, like this:
receiveData({"the": "data"});
And you "call" the cross-domain server by adding a script tag to your page. jQuery elegantly wraps all of this up in its ajax function.
Another technique that I've had to use at times is cross-document communication through iframes. You can have one window talk to another, even cross-domain, in a restricted manner through postMessage. Note that only recent browsers have this functionality, so that option is not viable in all cases without resorting to hackery.
You're going to need to have your response sent back to your client via a JSONP call.
What you'll need to do is to have your request for data wrapped in a script tag. Your server will respond with your data wrapped in a function call. By downloading the script as an external resource, your browser will execute the script (just like adding a reference to an external JS file like jQuery) and pass the data to a known JS method. Your JS method will then take the data and do whatever you need to do with it.
Lots of steps involved. Using a library like jQuery provides a lot of support for this.
Hope this helps.

Resources