You can't assign an event to an element that does not exist yet, and
the "uncheckall_field" does not exist until you click the first link.
You could move the event assignment into the function that creates the
"uncheckall_field," but then you'd need to reassign the
"checkall_field" event later and you'll just go back-and-forth in a
big mess.
Instead, the simplest way to do this, off the top of my head, would be
to just have two different links, each with their respective click
events assigned, and then just toggle their visibility (actually, the
display property). You could start with the "checkall" visible and the
"uncheckall" hidden, then put the .toggle() method inside each click
event.
I don't know how you're using this, but you might not want the two
links to be exclusive. The most friendly implementation would allow
users to either uncheck or check all at any time.
Larry
On Jan 2, 3:24 pm, webophir <[EMAIL PROTECTED]> wrote:
> Hey all,
>
> I am very new to jQuery and becoming a fan of this wonderful
> framework.
>
> Please give me an idea of how to solve this problem if you know
> howtos.
>
> I am trying to create a form with many checkboxes with 'check all'
> link to check all the checkboxes. It's kind of simple and it is
> already in jQuery site tutorial. But what I wanted is that when I
> click 'check all' link, check all checkboxes as well as change the
> link text to 'uncheck all.'
>
> Here is my code:
> jQuery(document).ready(function() {
> // I do not show 'check all' when javascript is disabled from
> browser
> $("#field_check").html('<a href="" id="checkall_field">check all</
> a>');
>
> // when 'check all' is clicked, update the html id to
> 'uncheckall_field' and text to uncheck all
> $("#checkall_field").click(function() {
> $("#field_check").html('<a href=""
> id="uncheckall_field">uncheck all</a>');
> $("#dbcolumn [EMAIL PROTECTED]'checkbox']").check('on');
> return false;
> });
>
> $("#uncheckall_field").click(function() {
> $("#field_check").html('<a href="" id="checkall_field">check
> all</a>');
> $("#dbcolumn [EMAIL PROTECTED]'checkbox']").check('off');
> return false;
> });
>
> });
>
> Ok, from the firebug debugger, I can see the #checkall_field.click
> event listener is working, but after that, 'uncheck all' event
> listener is skipped.
>
> Any idea how to solve this problem?
> Thanks.
