Hmm, it sounds like the code is working fine.
What do you have for the CSS rules for .active and .inactive ?
And are you sure the page is loading the stylesheet correctly?


On Jun 12, 4:32 pm, Kevin Major <[EMAIL PROTECTED]> wrote:
> This is related to my past DOM traversal question from a day ago.
> Long story short, I have a series of checkbox inputs within table
> cells.  Upon a click event, the input, its containing cell, and the
> containing cell's next sibling should change CSS classes.
>
> According to Firebug, the class names are being changed correctly
> (running Firefox 2).  Yet, nothing is happening.  In IE7, only the
> input's class seems to be changing correctly.
>
> What's even more strange is that I get the same result using a non-
> jQuery method.  So, I'm thinking my approach is correct, given what
> Firebug is showing me, but I'm still not getting results.
>
> So, the general HTML setup is:
> <td><input class="inactive" type="checkbox" name="grid[]" value="1" /
>
> ></td><td>some text</td>.....
>
> jQuery version of the script:
> $(document).ready(function()
>    {
>       $(document.forms["Grid"].elements["grid[]"]).each(function()
>       {
>          $(this).click(function()
>          {
>             if($(this).hasClass("active"))
>             {
>                $(this).removeClass("active").addClass("inactive");
>                $
> (this).parent().next().andSelf().toggleClass("active");
>             }
>             else
>             {
>                $(this).removeClass("inactive").addClass("active");
>                $
> (this).parent().next().andSelf().toggleClass("active");
>             }
>          });
>       });
>    });
>
> Traditional version:
>    window.onload = function()
>    {
>       var grids = document.forms["Grid"].elements["grid[]"];
>
>       for(var i = 0; i < grids.length; i++)
>       {
>          grids[i].onclick = function()
>          {
>             if(this.className == "active")
>             {
>                this.className = "inactive";
>                this.parentNode.className = "inactive";
>                this.parentNode.nextSibling.className = "inactive";
>             }
>             else
>             {
>                this.className = "active";
>                this.parentNode.className = "active";
>                this.parentNode.nextSibling.className = "active";
>             }
>          }
>       }
>    }
>
> Basicaly, I'm just wondering if I'm doing something completely
> offbase, or if this behavior is supposed to be expected, or if it's a
> bug.  I've asked around at other venues, and haven't received an
> answer, so I'm still scratching my head.  It's infuriating because it
> LOOKS right, but nothing is happening.
>
> I hope that posting such a large message is okay.  If not, I apologize.

Reply via email to