Re: [jQuery] $(form.elements) fails (in IE this time)
FYI, i added the following two lines to my custom function, and all
is well.
$.fn.validateForm = function() {
var elems = this[0].elements || this;
elems = $($.merge(elems, []));
elems.each(function() {
// do custom validation stuff with each element
}
}
(FYI, i need the ability to pass a set of elements to this function,
because sometimes i want to perform validation on every element (by
passing form.elements), and sometimes i want to pass a subset of
elements (to validate part of a form) for reasons that are esoteric
to the site i'm working on.)
thanks brandon and everyone,
-p
On Nov 6, 2006, at 11:57pm, Brandon Aaron wrote:
This actually doesn't fix the issue and doesn't seem like it is
fixable since IE makes no distinction between the form node and the
form.elements collection. The workaround is to do it like this:
$($.merge(form.elements, []));
--
Brandon Aaron
On 11/6/06, Brandon Aaron [EMAIL PROTECTED] wrote:
Okay ... looking through all the properties of the form.elements
nodelist in IE reveals that it is exactly the form element as you
said. That also means it has a reference to the elements property. So
to fix this 'special case' I added this:
this.get( a.constructor == Array || a.length != undefined (
!a.nodeType || (jQuery.browser.msie a.elements) ) a[0] !=
undefined a[0].nodeType ?
This appears to work fine but I don't know if it will affect
anything else.
http://brandon.jquery.com/testing/node_lists/
If it doesn't break anything else, then we should probably get this
and the fix for #164 in SVN and get another point release out the
door.
--
Brandon Aaron
On 11/6/06, Dave Methvin [EMAIL PROTECTED] wrote:
Do you know what the nodeType test is for on that line?
That nodeType test is trying to tell the difference between a
NodeList and a
DOMElement. If it's a DOMElement it will have a non-zero nodeType.
What would break if we took it out?
If you took it out, any DOMElement with a .length property would
be treated
like a list and not an element. For example, the form element has
a length.
If you passed in $(document.myform) and myform had 3 elements,
jQuery.length
would be 3 instead of 1.
The intent was to allow collections like form.elements to pass in
lists of
nodes but still let you pass in the form element if you wanted to
refer to
just the form element. IE is spoiling that.
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] $(form.elements) fails in Safari
hey gang-- i'm seeing a new, related problem that thought i should bring to your attention. this occurs in rev. 522 and 524. I'm calling $(form.elements).customPluginThatIWrote(). as a test, before this statement, i alert(form.elements.length), getting a value of 16 (the # of elements in this particular form). then in my custom plugin, i have alert(this.size()). in Firefox and Safari this also returns 16, but in IE6 the value is 1 for some reason. i'm sorry i can't be of more help in figuring out why that's happening, but i thought it was worth bringing to everyone's attention. -p On Nov 2, 2006, at 6:09pm, Brandon Aaron wrote: On 11/2/06, Dave Methvin [EMAIL PROTECTED] wrote: We can't guarantee that someone didn't assign a 0 property to their function, but I say we let that one slide. Duck typing is not an exact science. Agreed and this is now in REV 524. -- Brandon Aaron ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/ ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
Re: [jQuery] $(form.elements) fails in Safari
awesome! just updated from the repository and placed a newly-built jquery (v.522) in my project and $(form.elements) works as i'd hoped. thanks so much aaron. -p On Nov 2, 2006, at 2:54pm, Brandon Aaron wrote: Now this is fixed in Rev 522. Again, sorry for the confusion. http://brandon.jquery.com/testing/safari_node_lists/index.html http://brandon.jquery.com/test/ -- Brandon Aaron On 11/2/06, Brandon Aaron [EMAIL PROTECTED] wrote: Wait ... I haven't tested $(form.elements) ... but rather appending the NodeList ... a quick glance at the code leads me to think this will still break and potentially crash Safari. I'll check into it now. Sorry for any confusion. -- Brandon Aaron On 11/2/06, Brandon Aaron [EMAIL PROTECTED] wrote: This is now resolved in Rev 521. -- Brandon Aaron On 11/2/06, Dave Methvin [EMAIL PROTECTED] wrote: Okay ... so here is the deal. Safari reports typeof on a nodeList as a function. So I used that and fixed the issue. Here is the link to the example/test: http://brandon.jquery.com/testing/clean_safari_node_lists/ ... I'm going to go ahead and commit ... unless anyone has some improvements. It's hard to argue with working. :) I noticed that allowed you to take out the previous Safari hack for HTML args, that's great. So you fixed the bug and the code got shorter! ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/ ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/ ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
[jQuery] Unable to bind click function in a dynamically created object?
hey gang--
i got a bit of a stumper for ya, trying to bind a function to the
click event of each link in a dynamically generated list.
i have a bunch of long content pages that we're breaking up into
subpages, with a sidenav to navigate through them. the markup for
each page is as follows:
div class=page
h3Page One Title/h3
p/p
p/p
/div
div class=page
h3Another Page Title/h3
p/p
p/p
/div
here's the function that sets up the list of links and stuffs them
into the sidenav.
$('.page').each(function(i) {
var title = $('h3',this).eq(0).text();
var link = $('lia href=#page'+(i+1)+''+title+'/a/li');
$('.sidenav ul').append(link);
$('a',link).click(function() {
alert(1);
// $('.page',pages).hide();
// $(page).show();
});
});
$('.page').hide().eq(0).show();
it grabs the text of the first H3 in each section to use as the link
text. it builds an LI element containing the link, then appends that
to the sidenav. then it tries to assign a click handler to the link.
i've commented out the functional part of the click function and just
put in an alert for testing, but the function isn't firing when i
click these links. am i missing something?
thanks for any help,
-p
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Unable to bind click function in a dynamically created object?
ah, i'm sorry, i found the problem, in another function that is
running on document.ready. (it's converting the sidenav into a
rounded box by grabbing the html and recreating the div, so the click
handlers are getting lost. it's an old function that i'll have to
rewrite in a more JQ way.)
-p
On Oct 18, 2006, at 2:33pm, Klaus Hartl wrote:
Pascal schrieb:
hey gang--
i got a bit of a stumper for ya, trying to bind a function to the
click event of each link in a dynamically generated list.
i have a bunch of long content pages that we're breaking up into
subpages, with a sidenav to navigate through them. the markup for
each page is as follows:
div class=page
h3Page One Title/h3
p/p
p/p
/div
div class=page
h3Another Page Title/h3
p/p
p/p
/div
here's the function that sets up the list of links and stuffs them
into the sidenav.
$('.page').each(function(i) {
var title = $('h3',this).eq(0).text();
var link = $('lia href=#page'+(i+1)+''+title+'/a/li');
$('.sidenav ul').append(link);
$('a',link).click(function() {
alert(1);
// $('.page',pages).hide();
// $(page).show();
});
});
$('.page').hide().eq(0).show();
it grabs the text of the first H3 in each section to use as the link
text. it builds an LI element containing the link, then appends that
to the sidenav. then it tries to assign a click handler to the link.
i've commented out the functional part of the click function and just
put in an alert for testing, but the function isn't firing when i
click these links. am i missing something?
thanks for any help,
-p
I see one thing that may cause the problem: your variable link is a
jQuery object. This is passed as context a few lines later on, but you
have to pass a DOM node as context to the $ function.
Try this:
$('a', link[0]).click(...);
Or to overall shorten the code:
var link = $('li ... /li').appendTo('.sidenav ul')[0];
$('a', link).click(...);
Does that help?
-- Klaus
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
Re: [jQuery] Please help (again, sorry)..NextUntil not working
just wanted to pipe in here, i'm using $.nextUntil and $.wrapAll in
the custom paginator i'm building and it worked great. thanks, john.
-p
On Oct 18, 2006, at 12:21pm, John Resig wrote:
Ok, I did some more digging and you're right. I don't think I ever
actually tested nextUntil (oops!)
The full implementation can be found here:
http://john.jquery.com/jquery/test/nextuntil.html
This includes a working version of nextUntil:
$.fn.nextUntil = function(expr) {
var match = [];
// We need to figure out which elements to push onto the array
this.each(function(){
// Traverse through the sibling nodes
for( var i = this.nextSibling; i; i = i.nextSibling ) {
// Make sure that we're only dealing with elements
if ( i.nodeType != 1 ) continue;
// If we find a match then we need to stop
if ( jQuery.filter( expr, [i] ).r.length ) break;
// Otherwise, add it on to the stack
match.push( i );
}
});
return this.pushStack( match, arguments );
};
Additionally, I realized that .wrap() isn't going to do what you need
it to. .wrap() wraps each matched element with the same structure. So
if you matched 3 paragraphs, you'd have three surrounding divs too.
Since you want it to wrap all of the matched elements with a single
element, I made a new .wrapAll() plugin:
$.fn.wrapAll = function() {
// There needs to be at least one matched element for this to work
if ( !this.length ) return this;
// Find the element that we're wrapping with
var b = jQuery.clean(arguments)[0];
// Make sure that its in the right position in the DOM
this[0].parentNode.insertBefore( b, this[0] );
// Find its lowest point
while ( b.firstChild ) b = b.firstChild;
// And add all the elements there
return this.appendTo(b);
};
So - all of that should help you along now. Let me know if this
works for you.
--John
On 10/18/06, Greg Bird [EMAIL PROTECTED] wrote:
Thanks for this Blair.a really interesting approach and one I
wouldn't
have thought of myself.
At the moment, I am having problems with the NextUntil function,
but once I
have this solved, your suggestion may be a really neat
implementation.
Cheers, Greg
Blair McKenzie-2 wrote:
This is just a guess:
function BuildNav() {
$(#content h2).each(function(){
$(this).before(div class='note
newdivmarker'/div).nextUntil(h2).appendTo
(.newdivmarker); $(
div.newdivmarker).removeClass(newdivmarker);
});
}
It relies on the assumption that appendTo moves the origonal
element list,
rather than clones them. Basically:
1. It adds your div before the heading, with a temporary
marker so we
can find it again
2. Selects all elements until the next heading
3. Moves them to the div
4. Removes the marker from the div
Blair
On 10/18/06, Greg Bird [EMAIL PROTECTED] wrote:
Hi John,
thanks again for your help, unfortunately I have deployed your
suggestions
and am still unable to get it to work. You can view my testpage
at:
http://members.optusnet.com.au/greg.bird/mm/collapse.html
My .js now reads:
$(document).ready(function(){
BuildNav();
});
//DEFINE NextUntil FUNCTION
$.fn.nextUntil = function(expr) {
var match = [];
this.each(function(){
var cur = this.nextSibling;
while ( cur jQuery.filter( expr, [cur] ).r.length ) {
match = jQuery.merge( match, [ cur ] );
cur = cur.nextSibling;
}
console.log(this,cur,match);
});
return this.pushStack( match, arguments );
};
/*BUILD SIDE NAVIGATION*/
function BuildNav() {
$(#content h2).each(function(){
$(this).nextUntil(h2).wrap(div class='note'/div);
});
}
I have logged the script and it appears that the match array
is not
being
populated. I suspect that the Jquery.merge function is not
triggering
properly
Does this function work with JQUERY 1.0.2? In note in the
JQUERY doco
that
the function call is now $.merge. Trialled this without success.
My aim here is to put a unique div around each section of the
page and
then
dynamically create an expand/collapse navigation system. Have
already
achieved a similar result with a sliding navigation system. You
can see
this at:
http://members.optusnet.com.au/greg.bird/mm/index.html
This was easier as I didn't need to wrap div's around anything, but
simply
anchor to the existing H2's
Have you got any suggestions? Do you have any test pages so
that I can
view
your implementation?
Thanks in advance, Greg
John Resig wrote:
Hi Greg -
I created a plugin a while back that can help with this, called
nextUntil:
$.fn.nextUntil = function(expr) {
var match = [];
this.each(function(){
var cur = this.nextSibling;
while ( cur jQuery.filter( expr, [cur]
[jQuery] $.fn.height in dimensions.js
I added the dimensions.js plugin to a project I'm working on (mostly to get access to the offset component that was added recently) and I noticed that it steps on jquery's builtin height() function which can be used to get or set the height value. is there a reason for this? i commented out that part of the plugin (as well as the $.fn.width() part) and the parts of my project that were using $.fn.height() to set the height of an object are now working again. is there a reason the dimensions plugin was coded to replace these builtin functions without replicating their ability to set and well as get the height of an object? -p ___ jQuery mailing list discuss@jquery.com http://jquery.com/discuss/
[jQuery] extending existing DOM elements
hey gang--
I have a project which is using JQuery as its javascript foundation.
In that project have a page of modules (div class=pmodule) that i
would i like extend using Function.prototype or the JQuery equivalent.
what i'd like to do is create a prototype object (with some custom
methods) and then convert each of those DOM elements into an instance
of that prototype object, so that each module on the page will then
attain those custom methods.
here's a simplified version of what i have so far:
function Pmodule() {
};
Pmodule.prototype = {
doSomething: function() {
alert(1);
},
doSomethingElse: function(somevalue) {
alert(somevalue);
}
};
$.fn.pmodule = function() {
return this.each(function() {
// here i'd like to convert each div class=pmodule into an
instance of the Pmodule object
// so it will have all the private methods defined in that
object
// but I'm not sure where to go from here
});
};
$(document).ready(
function() {
$('.pmodule').pmodule();
}
);
any help at all would be greatly appreciated. if this can be done
differently/more efficiently in some other way please feel free to
turn this upside down.
thanks,
-p
___
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
