[jQuery] Re: Unexpected $(document).ready() behavior when jQuery is loaded after the page
I came across this issue while looking at LAB.js. Is this known to be
fixed in latest nightly? From what I can tell document.ready still
won't fire if jQuery is loaded after DOM Ready has occurred. Here's my
test code:
// make sure dom ready has already happened by attaching an event to
old school window.onload
window.onload = function() {
console.log('window onload fires');
var url = http://code.jquery.com/jquery-nightly.js;;
var head = document.getElementsByTagName(head)[0], done = false;
var script = document.createElement(script);
script.src = url;
script.onload = script.onreadystatechange = function() {
if (!done (!this.readyState || this.readyState == loaded ||
this.readyState == complete)) {
console.log('jquery nightly is done loading');
done = true;
$(document).ready(function() {
console.log('dom ready functions should fire
now');
});
}
};
head.appendChild(script);
};
- Sasha
On Oct 8, 5:18 pm, Michael Geary m...@mg.to wrote:
Failing to run the document ready functions is a bug in jQuery 1.3.2 that is
fixed in the current svn. It now calls document.ready listeners even if you
load jQuery and subsequent document ready functions dynamically.
At least I *assume* that it's a bug that was fixed, and not just an
accidental improvement! :-)
Try your code with the nightly you can get here:
http://docs.jquery.com/Downloading_jQuery#Nightly_Builds
Regarding the onload for the script, the best way to handle this is to make
a custom copy of jquery.js or jquery.min.js and add a line to the end:
window.jQueryLoaded jQueryLoaded();
Then you provide a global jQueryLoaded() function before loading jQuery, and
that has your other initialization code (using document ready if you want
with the new jQuery code).
Or you can add whatever initialization code you want at the end of your
jquery.js file.
-Mike
p.s. Speaking of jQuery svn, are there nightly builds or the like
On Thu, Oct 8, 2009 at 6:11 AM, Ryan Crumley crum...@gmail.com wrote:
Rob,
Point taken about using onLoad for a script tag possibly not being
supported. In this case however that part of the code is working fine.
The issue I am having is related to jQuery being added to a page after
the page has completed loading. When this happens ready listeners are
never executed. If jQuery is present when the page loads then ready
listeners are executed as expected.
Ryan
On Oct 8, 12:45 am, RobG robg...@gmail.com wrote:
On Oct 8, 10:04 am, Ryan Crumley crum...@gmail.com wrote:
I am experiencing unexpected behavior using $(document).ready() on a
page where I inject jQuery after the page has loaded and then attach
listeners to the ready event. The ready() event is never called using
Firefox and Safari however it is called using IE.
[...]
function loadjquery() {
var url =
http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/
jquery.js;
var head =
document.getElementsByTagName(head)[0], done = false;
var script = document.createElement(script);
script.src = url;
script.onload = script.onreadystatechange =
function() {
There is no onload attribute for script elements defined in HTML 4.01,
therefore you should not expect that a script element will fire a load
event. The fact that some browsers do and some don't should be enough
to tell you that browser behaviour is inconsistent. You are unlikely
to be able to reliably fix that with script.
If you want a reliable indicator that a script has finished loading
and is ready for use, put a statement at the bottom like:
var SCRIPT_LOADED = true;
--
Rob
[jQuery] Re: Unexpected $(document).ready() behavior when jQuery is loaded after the page
Is this known to be fixed in the nightly? I wrote a quick test, seems
like document.ready still doesn't fire if jQuery is loaded after DOM
Ready:
// make sure dom ready has already occured by attaching an event to
old school window.onload
window.onload = function() {
console.log('window onload fires');
var url = http://code.jquery.com/jquery-nightly.js;;
var head = document.getElementsByTagName(head)[0], done = false;
var script = document.createElement(script);
script.src = url;
script.onload = script.onreadystatechange = function() {
if (!done (!this.readyState || this.readyState == loaded ||
this.readyState == complete)) {
console.log('jquery nightly is done loading');
done = true;
$(document).ready(function() {
console.log('dom ready functions should fire
now');
});
}
};
head.appendChild(script);
};
Maybe I'm missing something? I think this is going to be a bigger
issue as more people start to use things like LAB.js and EFWS to
dynamically load js.
- Sasha Sklar
On Oct 8, 5:18 pm, Michael Geary m...@mg.to wrote:
Failing to run the document ready functions is a bug in jQuery 1.3.2 that is
fixed in the current svn. It now calls document.ready listeners even if you
load jQuery and subsequent document ready functions dynamically.
At least I *assume* that it's a bug that was fixed, and not just an
accidental improvement! :-)
Try your code with the nightly you can get here:
http://docs.jquery.com/Downloading_jQuery#Nightly_Builds
Regarding the onload for the script, the best way to handle this is to make
a custom copy of jquery.js or jquery.min.js and add a line to the end:
window.jQueryLoaded jQueryLoaded();
Then you provide a global jQueryLoaded() function before loading jQuery, and
that has your other initialization code (using document ready if you want
with the new jQuery code).
Or you can add whatever initialization code you want at the end of your
jquery.js file.
-Mike
p.s. Speaking of jQuery svn, are there nightly builds or the like
On Thu, Oct 8, 2009 at 6:11 AM, Ryan Crumley crum...@gmail.com wrote:
Rob,
Point taken about using onLoad for a script tag possibly not being
supported. In this case however that part of the code is working fine.
The issue I am having is related to jQuery being added to a page after
the page has completed loading. When this happens ready listeners are
never executed. If jQuery is present when the page loads then ready
listeners are executed as expected.
Ryan
On Oct 8, 12:45 am, RobG robg...@gmail.com wrote:
On Oct 8, 10:04 am, Ryan Crumley crum...@gmail.com wrote:
I am experiencing unexpected behavior using $(document).ready() on a
page where I inject jQuery after the page has loaded and then attach
listeners to the ready event. The ready() event is never called using
Firefox and Safari however it is called using IE.
[...]
function loadjquery() {
var url =
http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/
jquery.js;
var head =
document.getElementsByTagName(head)[0], done = false;
var script = document.createElement(script);
script.src = url;
script.onload = script.onreadystatechange =
function() {
There is no onload attribute for script elements defined in HTML 4.01,
therefore you should not expect that a script element will fire a load
event. The fact that some browsers do and some don't should be enough
to tell you that browser behaviour is inconsistent. You are unlikely
to be able to reliably fix that with script.
If you want a reliable indicator that a script has finished loading
and is ready for use, put a statement at the bottom like:
var SCRIPT_LOADED = true;
--
Rob
[jQuery] binding and re-binding
Hi everyone. I've run across what must be a common problem: When my page loads, I bind every element of a certain class to some function (via click, focus, or whatever). Then I dynamically create another element with that same class on the page, and the new element lacks the binding. Is there a nice shorthand way of saying bind this function to this class/id/selector always and forever, no matter whether matching elements are created or destroyed? I'd rather not have to worry about re-binding my elements every time I create new ones. Thanks! SA
[jQuery] [validator] how to turn off validation once it's turned on
Hi - I'm looking for a way to validate a form with two buttons. The first button will add the form's contents (if they're valid) to the row of a table below the form. (Several rows can accumulate in the table.) The second button will proceed to the next page if either 1) there's valid content in the form or 2) the table has at least one row in it. What I'm trying to figure out is if I can turn off the validator for the 2nd button when I add a row to the table, while keeping it active for the 1st one. Ideally, I'd like to create a validator, remove it when I add a row to the table, and reinstate it when the user interacts with the form. Thanks!
[jQuery] [validator] trouble using rules(remove)
Hello world,
From everything I can understand from the doc, this code
--
form id=myForm
input type=text class=age required id=age/
input type=checkbox id=checker/ click me.
input type=submit/
/form
script
$(document).ready(function(){
$(#myForm).validate();
$(#checker).bind(click keypress, function(){
$(#age).rules(remove);
$(#age).removeAttrs(required);
alert($(#age).rules().required);
});
});
/script
-
ought to mean that when the checker checkbox is clicked, false is
shown in an alertbox, and the required rule on the age field is
removed, so that the form passes validation afterward.
However, I see true when I click the checkbox, and the form doesn't
pass validation after that (when the submit button is clicked, it
fails validation and the this field is required message appears).
Help?
[jQuery] Re: [validator] trouble using rules(remove)
Wow, that makes... a lot of sense. ={) All hail... Thanks! SA
On May 19, 5:48 pm, Jörn Zaefferer joern.zaeffe...@googlemail.com
wrote:
Use $(#age).removeClass(required);
The rules method doesn't affect inline metadata (eg. classes,
attributes). And required is a class here, not an attribute.
Jörn
On Tue, May 19, 2009 at 10:26 PM, Sasha sasha.akh...@gmail.com wrote:
Hello world,
From everything I can understand from the doc, this code
--
form id=myForm
input type=text class=age required id=age/
input type=checkbox id=checker/ click me.
input type=submit/
/form
script
$(document).ready(function(){
$(#myForm).validate();
$(#checker).bind(click keypress, function(){
$(#age).rules(remove);
$(#age).removeAttrs(required);
alert($(#age).rules().required);
});
});
/script
-
ought to mean that when the checker checkbox is clicked, false is
shown in an alertbox, and the required rule on the age field is
removed, so that the form passes validation afterward.
However, I see true when I click the checkbox, and the form doesn't
pass validation after that (when the submit button is clicked, it
fails validation and the this field is required message appears).
Help?
[jQuery] [validate] can I fool the validator into letting me submit the form?
Hi everyone - I've used and loved the form validation plugin developed by Jörn Zaefferer, and I've run into several cases in which I would like to be able to essentially say, if these conditions are met, the form's valid, period, without actually checking through valid(), element() or any other means. Is there a method I can call that just forces the validator element to think it's valid, without actually validating the form? Thanks much in advance!
[jQuery] Re: [validate] can I fool the validator into letting me submit the form?
Hi Jörn - One example is this: I've got a form on a page, and when the contents are valid they can be added to a dynamically-generated table via a button at the bottom of the page, which also blanks out the form. Then the user can click through to the next page with a Next button below that. As long as either 1) the form's contents are valid or 2) there is at least one row in the table, I want the Next button to be enabled and allow the user to continue. (Actually, it'd be nice to specify for #2 there's at least one row in the table AND the form is blank, but I'd settle for the above for now.) My thought was to set a flag when I added a row to the table that would simply tell the validator that the form was valid, no matter what it thought it saw, then remove the flag if the user deletes all the rows in the table. Is this possible? On May 18, 2:54 pm, Jörn Zaefferer joern.zaeffe...@googlemail.com wrote: Could you give a more specific example how you would use that? Jörn On Mon, May 18, 2009 at 7:25 PM, Sasha sasha.akh...@gmail.com wrote: Hi everyone - I've used and loved the form validation plugin developed by Jörn Zaefferer, and I've run into several cases in which I would like to be able to essentially say, if these conditions are met, the form's valid, period, without actually checking through valid(), element() or any other means. Is there a method I can call that just forces the validator element to think it's valid, without actually validating the form? Thanks much in advance!
[jQuery] index() problem
Seems like this should be straightforward based on the documentation:
...
select id=mySelect
option value=0 selected=selectedwhatever/option
option value=1other whatever/option
/select
...
script
$(document).ready(function(){
alert($(#mySelect).index($(option[value=1])));
});
/script
ought to alert 1 - right? Instead I get -1.
If I change #mySelect in the script block to *, I get 16, the
true index of the option among all the elements of the page. But I'm
wanting to find the index of the option element within the select
element.
Thanks to anyone who can help! SA
[jQuery] Re: index() problem
I bow, MorningZ. Many thanks and much respect - SA
On May 18, 10:47 pm, MorningZ morni...@gmail.com wrote:
The index of the object you are looking for needs to be in the
collection of objects you select. which isn't the case of your
selector, as you are looking for an option tag in a collection
(that's just one item) of select tags
Right from the docs (http://docs.jquery.com/Core/index)
Searches every matched element for the object and returns the index
of the element, if found, starting with zero
so, knowing this
$(#mySelect option).index($(option[value=1]))
Should give you the value you are looking for
On May 18, 10:07 pm, Sasha sasha.akh...@gmail.com wrote:
Seems like this should be straightforward based on the documentation:
...
select id=mySelect
option value=0 selected=selectedwhatever/option
option value=1other whatever/option
/select
...
script
$(document).ready(function(){
alert($(#mySelect).index($(option[value=1])));});
/script
ought to alert 1 - right? Instead I get -1.
If I change #mySelect in the script block to *, I get 16, the
true index of the option among all the elements of the page. But I'm
wanting to find the index of the option element within the select
element.
Thanks to anyone who can help! SA
[jQuery] Permission denied error with 1.1.4
I'm getting a 'Permission denied' error in IE6 when a jQuery 1.1.4 is
loading. When I swap back to 1.1.3.1, it loads properly and page works
fine. It works in Firefox with both libraries.
IE's error prompt shows the following info:
Line: 359
Char: 4
Error: Permission denied
Code: 0
but, when I use a SplineTech JavaScript debugger the code fails in a
'bindReady()' function at 'document.write(...)'
function bindReady(){
if ( readyBound ) return;
readyBound = true;
// If Mozilla is used
if ( jQuery.browser.mozilla || jQuery.browser.opera )
// Use the handy event callback
document.addEventListener( DOMContentLoaded, jQuery.ready,
false );
// If IE is used, use the excellent hack by Matthias Miller
//
http://www.outofhanwell.com/blog/index.php?title=the_window_onload_problem_revisited
else if ( jQuery.browser.msie ) {
// Only works if you document.write() it
document.write(scr + ipt id=__ie_init defer=true +
src=//:\/script);
By the way, we use a Lotus Domino 6.53 server for web development.
Thanks
