jQuery plugin - tableRowCheckboxToggle
February 26th, 2008
So since I’ve been playing with jQuery on my spare time while putting together an ajax site, I’ve decided to tackle a design issue I’ve run into many times at work with jQuery. This idea originally comes from phpMyAdmin. If you’ve used that software, you know that when you click on any table row, it automatically toggles the checked state of the checkbox in the first cell. I think that’s an extremely user friendly thing to have since checkboxes are so small and hard to click on.
Let me present you my friends, my first jQuery plugin. It generically adds the toggle function to any table rows you specify based on the css class names. It will by default toggle any checkboxes within the table row. However, you can manually exclude checkboxes based on name, id or css classes in the script. In addition to the phpMyAdmin function, I added an initialization step in the script that correctly marks a row when it’s considered checked on page load.
tableRowCheckboxToggle
- It generically adds the toggle checkbox function to any table rows you specify based on the css class names.
- It will by default toggle any checkboxes within the table row.
- You can manually exclude checkboxes based on name, id or css classes in the script.
- If there is any applicable checkboxes inside of the table row that are checked, it will apply a class to the table row.
- It also marks table rows when there are checked applicable checkboxes on page load.
jQuery plugin tableRowCheckboxToggle
11 Comments Leave a Comment
February 27th, 2008 at 12:16 amBubs on 2/27/2008 at 12:16 am said:
Nice work! I’ve always wondered how that worked in phpMyAdmin
Did you know your smilies aren’t working?
Yay I think the smilies stopped working after I upgraded. I must have overwritten a file or something. Need to figure out. I wish the setting is in the database so I don’t have to worry about overwriting it. Any tips?
btw, i found that you can overwrite the default smiles in the wp-config.php file instead of the wp-includes/functions.php file like i had been doing. since you are unlikely to replace the wp-config.php file during wp upgrade, it’s a lot better to put your smilies def in there. for more info, visit http://www.tamba2.org.uk/wordpress/smilies/
Do you think with some tinkering this could also work within a tree menu with checkboxes associated with parent and child nodes? I’m working on something where the menu items would change the background color after they have been unchecked signifying they have been deactivated.
Matthew Mansfield on 2/29/2008 at 12:54 pm said:
Do you think with some tinkering this could also work within a tree menu with checkboxes associated with parent and child nodes? I’m working on something where the menu items would change the background color after they have been unchecked signifying they have been deactivated.
it’s meant to be used by table rows. if you want it to work with your menu, learn jQuery and write it from scratch is probably easier than tweaking the plugin.
Nice work, but on hover don’t change color in IE 6. it do in IE 7, what should do so that it starts work.
john on 3/18/2008 at 1:20 am said:
Nice work, but on hover don’t change color in IE 6. it do in IE 7, what should do so that it starts work.
Because IE 6 doesn’t support it, search google for some hacks. I recommend csshover2.htc
Is there any way to modify this to work on tables after they have been dynamically sorted?
Anyone? I tried resetting the function on a sorted callback but it didn’t reset the previous stored indexes… Nice piece of code by the way.
Jesse on 4/18/2008 at 2:11 pm said:
Anyone? I tried resetting the function on a sorted callback but it didn’t reset the previous stored indexes… Nice piece of code by the way.
Jesse, I don’t know which sorting plugin you are using for the tables. I don’t really have time to either. I’d recommend you try the jQuery mailing list. It’s pretty active.
Nice work! I’ve always wondered how that worked in phpMyAdmin
Did you know your smilies aren’t working?