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.
Pure-Essence.Net 
Nice work! I’ve always wondered how that worked in phpMyAdmin 😉
Did you know your smilies aren’t working?
[Comment ID #233651 Will Be Quoted Here]
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.
[Comment ID #237094 Will Be Quoted Here]
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.
http://onetruebrace.com/custom-smilies/
You may find this plugin useful 😉
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.
[Comment ID #255339 Will Be Quoted Here]
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.
[Comment ID #259471 Will Be Quoted Here]
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.
This is nice, thanks for sharing
is it difficult to modify this to work for the selected radio button, rather than checkboxes?