jQuery.fn.checkBoxTableHighlighter = function(){
return this.each(function() {
var $obj = $(this);
var jsObj = this;
[COLOR=red][B] var $table = $("tr > td", this);[/B][/COLOR]
[B][COLOR=red] alert($table.attr("tag")); //coming up as undefined[/COLOR][/B]
if(jsObj.tagName.toLowerCase() == "input" && jsObj.type.toLowerCase() == "checkbox"){
//actions on check box
}
else if(jsObj.tagName.toLowerCase() == "table"){
//actions on table
//on page load, highlight rows for a table that has a specified selector
$obj.children().filter(':has(:checkbox:checked)').closest("tr").addClass(defaults.highlightClass);
//on page load, remove high light for the check boxes that are not checked
$obj.children().filter(':has(:checkbox:not:checked)').closest("tr").removeClass(defaults.highlightClass);
//check box clicked with the specified table css selector
$obj.children().filter(':has(:checkbox)').click(function (e) {
highlight.CheckBoxRowSelect(e, $(this));
});
//check box keyup with the specified table css selector
$obj.children().filter(':has(:checkbox)').keyup(function (e) {
highlight.CheckBoxRowSelect(e, $(this));
});
}
});
};
call:
$(".someItem").checkBoxTableHighlighter();
When the check box is checked (onload, click or keyup), if the table has a specified selector then i want to change the background color. I already have a working sample that i am converting to plugin. Since, my selector is at the table level, how can i find the checkboxes that are inside tr and td?
I have changed to following and still no luck:
Call
[U][SIZE=1]$[/SIZE][/U][SIZE=1]([/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]".tableHighlightSelector tr td"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]).checkBoxTableHighlighter();[/SIZE]
[SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]return this[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000].each([/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]function[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000]() { [/COLOR][/SIZE]
[SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]var [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]$obj [/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]= [/COLOR][/SIZE][/COLOR][/SIZE][U][SIZE=1]$[/SIZE][/U][SIZE=1]([/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]this[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]);[/SIZE]
[SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]var [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]jsObj [/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]= [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]this[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]; [/SIZE]
[SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]if[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1](jsObj.tagName.toLowerCase() [/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]== [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]"input" [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]&& [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]jsObj.type.toLowerCase() [/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]== [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]"checkbox"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]){[/SIZE]
[SIZE=1][COLOR=#808080][SIZE=1][COLOR=#808080]//actions on check box[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#000000]}[/COLOR][/SIZE]
[SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]else if[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1](jsObj.tagName.toLowerCase() [/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]== [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]"table" [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]|| [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]jsObj.tagName.toLowerCase() [/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]== [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]"tr" [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]|| [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]jsObj.tagName.toLowerCase() [/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]== [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]"td"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]){[/SIZE]
[SIZE=1][COLOR=#808080][SIZE=1][COLOR=#808080]//actions on table[/COLOR][/SIZE]
[SIZE=1][COLOR=#808080]//on page load, highlight rows for a table that has a specified selector[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#000000]$obj.filter([/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]':has(:checkbox:checked)'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000]).closest([/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]"tr"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000]).addClass(defaults.highlightClass);[/COLOR][/SIZE]
[SIZE=1][COLOR=#808080][SIZE=1][COLOR=#808080]//on page load, remove high light for the check boxes that are not checked[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#000000]$obj.filter([/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]':has(:checkbox:not:checked)'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000]).closest([/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]"tr"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000]).removeClass(defaults.highlightClass);[/COLOR][/SIZE]
[SIZE=1][COLOR=#808080][SIZE=1][COLOR=#808080]//check box clicked with the specified table css selector[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#000000]$obj.filter([/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]':has(:checkbox)'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000]).click([/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]function [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000](e) { [/COLOR][/SIZE]
[SIZE=1]highlight.CheckBoxRowSelect(e[/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff], [/COLOR][/SIZE][/COLOR][/SIZE][U][SIZE=1]$[/SIZE][/U][SIZE=1]([/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]this[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]));[/SIZE]
[SIZE=1]});[/SIZE]
[SIZE=1][COLOR=#808080][SIZE=1][COLOR=#808080]//check box keyup with the specified table css selector[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#000000]$obj.filter([/COLOR][/SIZE][SIZE=1][COLOR=#008484][SIZE=1][COLOR=#008484]':has(:checkbox)'[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000]).keyup([/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]function [/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#000000](e) {[/COLOR][/SIZE]
[SIZE=1]highlight.CheckBoxRowSelect(e[/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff], [/COLOR][/SIZE][/COLOR][/SIZE][U][SIZE=1]$[/SIZE][/U][SIZE=1]([/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]this[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]));[/SIZE]
[SIZE=1]});[/SIZE]
[SIZE=1]}[/SIZE]
[SIZE=1]});[/SIZE]
I have simplified it:
Call:
$(".tableHighlightSelector tr td input[type='checkbox']").checkBoxTableHighlighter();
Code:
return this.each(function() {
var $obj = $(this);
var jsObj = this;
$obj.closest("tr").addClass("rowhighlight");
});
closest tr is now coming up as undefined.
HTML:
[SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]table[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="300px"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]class[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="[U]tableHighlightSelector[/U]">[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]colspan[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="2">[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]Group 2[/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="20px"><[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]input[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]type[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="checkbox"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]name[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="group2"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]value[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="a"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]checked[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="checked"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]/></[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]A[/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="20px"><[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]input[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]type[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="checkbox"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]name[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="group2"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]value[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="b"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]/></[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]B[/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="20px"><[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]input[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]type[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="checkbox"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]name[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="group2"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]value[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="c"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]/></[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]C[/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]width[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="20px"><[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]input[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]type[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="checkbox"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]name[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="group2"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#ff0000][SIZE=1][COLOR=#ff0000]value[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]="d"[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]/></[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]<[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1]D[/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]td[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]tr[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]</[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#840084][SIZE=1][COLOR=#840084]table[/COLOR][/SIZE][/COLOR][/SIZE][SIZE=1][COLOR=#0000ff][SIZE=1][COLOR=#0000ff]>[/COLOR][/SIZE]
[/COLOR][/SIZE]
fixed, here is the full plugin:
call:
//when the check box is checked then the row will get highlighted. If it gets unchecked then the row highlighting will be removed
$("input[name='somename']").checkBoxTableHighlighter();
//to uncheck the check boxes and clear highlighting
$("input[name='somename']").checkBoxTableHighlighter('clear');
plugin:
jQuery.fn.checkBoxTableHighlighter = function(method){
var defaults = {
highlightClass: "rowhighlight"
};
var methods = {
init: function(options){
if (options)
$.extend( defaults, options );
//onload
methods.CheckBoxRowSelect('', $(this));
//click
$(this).click(function(e){
methods.CheckBoxRowSelect(e, $(this));
});
//keyup
$(this).keyup(function(e){
methods.CheckBoxRowSelect(e, $(this));
});
},
RemoveHighlightForAllNotChecked: function ($item) {
$item.filter(':not(:checked)').closest("tr").removeClass(defaults.highlightClass);
},
CheckBoxRowSelect: function (e, $clicked) {
if ($clicked.is(':checked')) {
$clicked.closest("tr").addClass(defaults.highlightClass);
methods.RemoveHighlightForAllNotChecked($('input[name=' + $clicked.attr("name") + ']')); //when we make checkbox behave like a radio button
}
else
$clicked.closest("tr").removeClass(defaults.highlightClass);
},
clear: function(){
$(this).filter(":checked").attr("checked", false);
methods.RemoveHighlightForAllNotChecked($('input[name=' + $(this).attr("name") + ']'));
}
};
return this.each(function() {
// Method calling logic
if ( methods[method] )
return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
else if ( typeof method === 'object' || ! method )
return methods.init.apply( this, arguments );
else
$.error( 'Method ' + method + ' does not exist' );
});
};