For a website, which doesn't use AJAX I'm using OnDocumentComplete event to know when the page loading is complete.
My question is, how can I detect when website, which uses AJAX requests is ready (e.g. when a website which is fetching some search results by using AJAX finished its work) ?
Ok here is a trick i developed my self.
1-in your html page make a div and set its text to "false".
2-in you server side put a javascript at the end of your returning code. for example your site returns following text upon an ajax call.
a
b
c
d
e
so after this text put a javascript code that will change the text of div from "false" to "true"
so what will happen is that once you receive all the data from ajax call you will also receive the javascript code and that code will run and set the value of div.
so in your page once all data is received you will see the indicator div. and you will know that you have received all data. you can also run functions in similar way upon completion of data.
Related
I want to create a page with will be filled with dynamic info using Ajax (JQuery). The info will come from various GETs I need to do in other URLs.
I'll be using Sinatra + JQuery to to that, but as my WEB experience is almost null and don't have any idea how do to it right.
The requisites for this are:
Each time a GET completes, a new line of information should appear on the page.
If the GET could not be complete, a default info appear on the page.
My idea so far is to do something like this:
Have my controller performing each GET inside a thread.
Each time a thread ends, with success or not, I inform the view of the result and render a partial
I'll have as many partial as I need (for each GET I must do)
The first time I load the page I fill in the default info, them I update via AJAX with the successful GET responses
This does not seem the correct approach, so I'm asking someone that already did something similar or has more experience on this some help.
You start off with a simple get('/'){} route that holds the default message (or any other GET route). Then you have your other GET routes that you want to display on your default route. In Sinatra you can check whether a request is an xhr-request or not with a request.xhr? If you have an xhr request you return a json value to your view, otherwise reject the request or render a view with proper html. This is on your sinatra backend. In your views you can use JQuery or any other JS library or plain JS to handle asynchronous data requests. You can use the ajax function in JQuery to request data from your routes and then add them to your DOM. It's as simple as that :)
Now you will have to investigate on the JQuery site how to make ajax requests and how to append data to existing DOMs. That's all there is to it.
I have a mobile site which completely runs using AJAX, and hash code, basically each page click is a link, such as
<a href='http://some-domain.com/my-page-122.php" hash-id='122'>linkage</a>
Meaning that the page itself exists and it has ON IT google analytics page, HOWEVER, on the ajax request, I only ask to load a certein <div> on said page using jQuery's load(), so my question is:
because the page is called for in it's entirety with the google analytics code and everything, will it still record it as a page view even though only a portion is injected to the page?
The reason why I'm asking is because this site is getting around 500 uniques per day, and we want to change it to this new AJAXy form, so not recording analytics is a big no-no.
If you use jQuery you can bind to the global AjaxComplete event to fire a Pageview everytime an Ajax call completes:
jQuery(document).ajaxComplete(function(e, xhr, settings){
var d = document.location.pathname + document.location.search + document.location.hash;
_gaq.push(['_trackPageview', d]);
});
If you update the Anchor every time you do an Ajax call this will fire the full path including the anchor part of the url.
Note that if you load content using .load that has the Google Analytics Tracking code in it, it will run that code and fire a second pageview. So you want to make sure you don;t include the GATC on the ajax content to avoid double pageviews.
Analytics won't record it automatically. Assuming you're using the asynchronous code you can record as many pageviews as you want by writing to the gaq array using an explicitly set URL:
_gaq.push(['_setAccount', 'UA-12345-1']);
_gaq.push(['_trackPageview', '/home/landingPage']);
In this case you can build whatever URL you want where they have '/home/landingPage'. Note that if _gaq was already properly instantiated and _setAccount was already pushed then you only need to push the _trackPageview.
Also, the event can be in code returned by your AJAX, or it can be in the click event of your button or whatever is launching the AJAX request.
See http://code.google.com/apis/analytics/docs/gaJS/gaJSApiBasicConfiguration.html#_gat.GA_Tracker_._trackPageview
I have a page where a user can upload a file along with some other input. Because I wanted this to be AJAX-like, I resorted to using an iFrame to accomplish this.
After the file is uploaded and an iFrame is loaded with a response page, I need to update a DIV outside of the iFrame with an AJAX call. The reason for separate updates, is that the result of the outside DIV depends on the input that the user provided with the file input.
Can this be done? Am I approaching this the wrong way?
Thank you!
UPD: Can the returned client code from within the iFrame "see" elements outside that iFrame?
Write your code in the onload event of the page loaded into the iframe. Then top will give you the top frame or parent will give you the parent frame.
Yes , it can be done. But you can do away with,the need for an AJAX-call , to update the outside the div.
Have your, servlet(assuming you are using JSP/servlets) that accepts the mutlipart request(the servlet that accepts the upload), return the intended response (to be shown on the refreshed iFrame), and ALONG WITH IT, the necessary information from the file input. This way you have all the necessary details on the client, in one response. A simple javascript function can achieve , updating the outer div with the information from the file input.
After I load a page through a WebBrowser, and I click a link that fires an AJAX script, I need to detect when the AJAX java script finishes loading HTML changes into a div. Since no DocumentCompleted event is fired when the AJAX script is run, I don't know when it finish running. Is there a way I can attach an event to be raised after I know 100% that the javascript finished changing the div?
The project is in C#.
Thanks
I did something similar recently (using jQuery):
$('#mydiv').change(function(){
// do stuff
}
);
Granted, I also use jQuery to set the HTML of that div. I suppose one non-jQuery approach for you could be to set HTML through your own function, which in turn can fire an onchange event.
#New in town: From my experience that is not correct. I use this on multiple DIVs that never get focus in the first place, and it works well and consistently. The normal behavior is as you describe, and normally only applies to the INPUT and SELECT elements, but this is not the case with jQuery.
There is no event. You must patch the JavaScript callback that the browser runs when the reply for the AJAX request comes in. This will contains code like "div.innerHTML = ...". Just put your code below that.
When we use AJAX for validation the response comes through xml file and in case of javascript the response comes through html page.
Is it true or false ?
please explian both the cases.
Ajax can return pretty much anything. Your particular application or implementation might be returning XML, but Ajax commonly returns JSON and HTML as well. But it can return TXT or just status codes ..
AJAX is such a broad term that both of your cases can be called like that. Basically every call from already loaded page is AJAX even if it's done by dynamically creating tag or refreshing iframe.
actually Ajax is nothing but a term to describe what is happening, the response comes as an xml or html depending on what you want it to return, it is a string that ajax returns, in Javascript it is up to you what to do with that string, want to parse it as XML node? want to display it immidiately in an element "innerHMTL" or want to alert the returned string... the power of ajax is not what it returns, it is what it does on the server (remotly) without having to send the whole page in.
AJAX there can be any type of return text. With Javascript it can work on the DOM object and get anything from the page.
The main difference, AJAX a request goes to the server and the result is returned.