I want to send another ajax request when one request is in process to get the status of first request.
If I call both the request the second request gets blocked till the completion of the first request.
I've got a script that, onload, loops through every tag on the page (getElementsByTagName ('*')) and can be pretty slow on some of my pages with MANY tags.
What I'm wondering is if there's some way I can tell the browser to run the script asynchronously, without locking up the browser while it loops through all the tags and adds its objects and properties to them?
I'm pretty sure I've made the script about as effecient as possible. There's just no way around checking all the tags.
Basically, what I am trying to do is call several ajax requests using jQuery on the same page, i know that all browsers are capable of requesting multiple requests. However in Chrome and Safari my website works fine, but IE, Firefox and Opera all only call the first request then dont call, the second two. I dont know why though?
All of the code for the site is here: [URL]
I'm trying to build a page that has multiple ajax calls on it. When you do it the old-fashioned way with XmlHttpRequest, you'd create a new xhr object for every call so that they execute simultaneously. If I try to do this in jquery it will only execute a call when the previous one has completed. This makes the page load time completely unacceptable. How to improve the performance?
View 2 Replies View RelatedAnyone loading a bunch of CSS or Javascript via <link> tags on a web page knows about "blocking": where the browser stops the loading of the page because it has to go fetch (and read/parse) an external file. If you have a lot of these, or even if you don't and the user has a slow connection, you have a slow page. Users hateses teh slow pages, hatses them.
At the 2010 Fronteers Conference, Stoyan Stefanov gave a talk on Progressive Downloads and Rendering, where he listed some tricks to get around blocking by Javascript or other external files to make page load speed up. One trick was adding a <script> tag in the body (near the bottom, so after the important stuff has loaded) which adds a <script> tag to the <head> dynamically and runs it. While that file is being fetched, the rest of the page can continue to load. This is a bit asynchronous, isn't it (similar to web pages still loading content while also fetching images)?
As a follow-up to his Higher Order Javascript article (see SitePoint thread about it), Piers Cawley has gone further with Asynchronous Streams, where he uses jQuery (as an example) to load external files asynchronously to avoid blocking of the HTML document loading. In my web development career I haven't worried about blocking, but plenty of folks around here are loading ginormous files, and lots of them, for large sites. As developers, what do you do to get around slow page loads? Have you done anything like this asynchronous calling of the external files?
I am working on a project that relies heavily on AJAX calls, they are done in dozens of places. There are a number of places where I would want to prevent the user from submitting information multiple times (form submissions etc ). I am trying to think of the best way to accomplish this.
I could simply disable the element that starts the AJAX call upon the first click and re-enable it upon completion of the call. I have also seen examples of developers using a class to handle ajax calls that store an identifier for the call and if it is in progress any new calls with the same identifier will be ignored.
I want to make a page which loads the div's with ajax The html code of the page is
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
//styles and other script code
<script language="javascript" src="../js/intro.js"></script>
</script>
[Code]....
Now the problem is that javascript "freezes" and setInterval does not work.. Is there any solution to load the files order such i have it in code one-by-one and run the message function?
I have several ajax calls that originates from the same page its updating. It works perfectly in firefox but in IE it works for about 18 requests and then just stops until the page is refreshed. I thought it was a cashe issue but I have added a variable for that. I think it may have something to do with binding but I am not sure how to sort that. This is one of my functions.
[Code]....
I'm trying to make a little loop that in each itteration executes a little php script to send mail with the mail() function. the php script returns either succes or failure. Now its my intention to append that msg to a div, after every execution.
$.ajax({
type: "POST",
data: dataString2,
url: "sendmail.php",
async: false,
success: function(result)
{
showStatus(result);
[Code]...
the show status(result) is nothing more then a .append(result) the zenMails(y) calls this function again to send the next mail. It does work though but it only updates the div after the entire loop is done, i 'ld think it ld do so after every execution since i call the showstatus when the synchronous call is done and only after that i call the next iteration. Is there anyway to work aroud this ? (making the call assync doesnt work , because the port for sending the mail would still be in use)
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload == 'function') {
window.onload = function() {
oldonload();
func();
}
} else {
window.onload = func;
}}
addLoadEvent(myFunction1);
addLoadEvent(myFunction2);
addLoadEvent(myFunction3);
...etc...
My problem is that some of these myFunction#s include AJAX calls but
the calls depend on each other in such a way that myFunction2 will not
work unless myFunction1 has completed. So what is the "nicest" way to
make sure of this? I've considered putting a hidden element in the
HTML and then changing it at the end of each function call and have
the onchange event trigger the next function call. But this seems very
hacky and overcomplicated - surely there must be a simpler and better
way....?
I'm having (once again) tremendous problems with IE (7), trying to create an application that behaves properly.
This time, it's with Ajax calls triggered by a button click, which do not behave asynchronously.
Here is the highlight of what I'm trying to achieve: a button clicked sends an ajax call to the server whilst the call is made and until the callback function has returned (or an error has been identified), a "wait" animation is triggered. (in the case below, simulated by appending a status in a div)
To achieve this, I decide to use .ajaxStart(), .ajaxStop() and .ajaxError() to trigger the wait animation. It works perfectly in FF and Chrome, but (as usual) not in IE. In IE, when I press the button, the button remains depressed until the ajax call is finished, and then all statuses are dumped at once onto screen. Not very asynchronous...
Here is my code:
If I uncomment line 11 and uncomment the alert, it seems that this forces IE to do things in the proper order. Obviously that's not a solution however...
Will I have to (once again) write IE-specific code to get things working properly?
When I try to fetch a page asyncronously I get a status 0 and the response text is empty: PHP Code:
var loaderImage = document.getElementById("loader");
loaderImage.style.display = "inline";
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState==4 && xmlhttp.status == 200) {
response = xmlhttp.responseText;
alert(response);
[Code]....
append.php:
<span>test</span>
jQuery function:
$(function(){
[Code]....
The content will be added on the first click, but not on the subsequent clicks however. The hidden field gets incremented fine though.
I'm trying to in make in a single function, multiple calls to the same file changing one parameter the problem is thatit is taking it like if I wasn't changing the parameter and is sending only the last value all the times.Here is my code:
$(function(){
$('#btn_search').click(function(){
// what to search for
[code]....
I'm developing an asp.net MVC app, and decided to take advantage of JQuery's great datepicker using the following code in my master page:
[Code]...
My problem is that the alert block of code never fires. When I change it to occur before the datepicker code, the alert fires but the datepicker part won't work. What am I doing wrong here?
I'm trying to use the jqmodal dialog plugin and everything is working OK except for one minor problem. It seems when I click on the link, the expected action does not occur until I click the second time. Essentially I set up a small test form with a single line put into a table. In that data line is an href, which when clicked calls an AJAX function and returns text, which displays as a dialog. Like I said, this works fine except for the fact that the dialog does not show until the second time I click on the link. I added an alert box to the code, so I know the function is executed the first time the link is clicked
<script>
$().ready(function() {
$("#hrefClick").click(function(e) {
e.preventDefault();
[Code]....
I've a js with a loop wich generate ten ajax calls, but I aboslutely need that the first will be executed before the others. how to ?
View 5 Replies View RelatedI'm creating an AJAX page that is built using a PHP Class, ie the php looks a bit like this: PHP Code:
$wp_page->addjs('../var/savepolicies.js')
$wp_parser->page = "userpolicywindow.php";
$wp_parser->addlink("Home","../index.php","");
$wp_parser->addlink("Logout","javascript:logout();","");
$wp_parser->getpageid("501");
[Code]...
within this page that has been created, there is an AJAX tree folder which calls another page to be loaded into a DIV by AJAX again. Code:
[Code]...
I don't know why it doesn't work because the page has been loaded with the JS file, but as soon as the link is added afterwards it doesn't work. I take it this is because it doesn't know where to find the JS, but how can I overcome this?
I'm experiencing a weird problem when trying to do a $.ajax call. When I pass 5 variables, with either GET or POST, the script runs as I would like. However, when I use 6 or more variables, the script does not run. Does anyone know why this is?
Relevant code (stops1-5 are defined as JS variables earlier in my script, and the alerts are for testing)
$(".barcrawl-stop-id").each(function(){
alert("running ajax function");
$.ajax({
url: "/handlers/ajax/barcrawl_reorder.php",
[Code]....
So, the way it is now, it works fine (I get the first alert for each instance of .barcrawl-stop-id, and get an alert at the end with the returned data). However, when I add another variable to the data, like stop4: stop4, the script does not run (all I see is one alert with "running ajax function").
I am a newbie to using jquery and have been exploring it developing a new app. At the moment I have a number of AJAX calls to the server which I have been queueing in an array and using a single $.ajax call to handle all of them. However I know about the browser limitations of two calls per page (at the same time and want to implement this to speed up page updating). To test concurrent ajax requests I have setup various asp pages to with delays 1sec, 5sec, 10sec etc etc. and a test html file with the follwing javascript
[Code]...
I know about the same-origin policy and that one of the only ways to load data from a cross-domain is to load it as JSON. However, all I am trying to do is access data from a server on another port (which I believe the browser still treats as cross-domain). I need to do this because the server my application is on is a map server and the other server (Apache) is the only one that can handle php scripts. I have also tried out the plug-in from [URL] and while it works when I do $('#phpContent').load('http://www.google.com'); it doesn't work when I try $('#phpContent').load('http://localhost:80/mapScripts/getFiles.php'); I have also tried$.get('http://localhost:80/mapScripts/getFiles.php', function(data) { $('#phpContent').html(data); });
So here I am breaking my brain and do not know what else to attempt.
is there a possibility to chain AJAX Requests? By now i have 5 AJAX Functions where one calls the next (Button Click
View 2 Replies View RelatedI am developing quite a complex user interface in jQuery that relies on an AJAX call to retrieve JSON.We have noticed that the code runs slow in IE7. IE8 and IE6 are acceptable. Firefox and Chrome really quick. I have traced the problem back to the AJAX call, which IE7 seems slow o process. What takes less than a second in the other browsers will take IE7 3 or 4. I have googled for an answer it seems there is some consensus that the native XHR in IE7 is slow, so it may not be a specific jQuery problem.Has anyone else experienced this? Does anyone have a solution? Please consider that this will be a public website, so the solution cannot involve altering settings on users' machines.
View 5 Replies View RelatedI have a jquery based system with ajax calls instead of page refreshes. Every time I return some ajax content, it replaces the content on the main div.
function execcmdcallback(data, textStatus, XMLHttpRequest)
{
$("#divmain").html(data);
data = null;
}
Each time this executes, the browser memory increases by about 600-900kb. Can anyone suggest a way of doing this where the old memory is freed so there is no significant increase in browser memory on each ajax call ?
I've studied this a bit, [URL]..., but I have to admit I don't quite understand it I see the same issue on IE8, FF and Chrome. FF comsumes less memory per ajax call and frees some memory seconds later, but still the total working set is increasing on each call by 300k in FF and 600 to 900 in chrome and IE
I'm trying to load a Javascript file which contains an array of data using .getScript(). It works fine on my server, but the request is never being made when I run it on my own computer, though the callback function is called. Is this an inherent limitation in JQuery/AJAX, or am I doing something stupid? code...
View 1 Replies View RelatedI want to be able to load content of multiple divs in just one click.And after the content has been loaded make a final call to a function on success.I'm using JQuery.when() wich works fine like this
[Code]...