Colorize - jQuery Table Plugin - 1.5.1

Thank you for this great plug-in. How can I make it to work with more than one level tr within thead. It works great if I only have one tr under thead.
Now when I click on "Total", "second level header middle" is also highlighted. I guess it's trying to match the 2nd th of the 3rd level tr to the 2nd level tr. It doesn't look right. Thanks in advance for any help.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

first level header

second level header left //colspan="4"
second level header middle //colspan="9"
second level header right //colspan="6"

//here is the last level table header I want to click on and highlight the column

Statistics by
Total
#PV
%Repl.HH
Type A
Type B
Type C
URE Int.
Par. Int.
Vac Rate
Resp. Rate
Salary of ref. per
HH Size
<14
14-19
20-29
30-39
40-49
50+

....

Hi, i love this plugin... However when i click on a hyperlink, the whole row got colorized :p

I seriously wanted the hiliteColor function but i doesn't want it to activate when i click on a hyperlink. How can i prevent that from happening? Cheers!

I have another small suggestion, to allow skipping of the row alternation. Simply to add a check for "none" on the line #143:


if (options.altColor!='none') {
jQuery(this).find('tr:odd').css('background', options.bgColor);
jQuery(this).find('tr:even').css('background', options.altColor);
}


Also, in fact, would be good to change the alternation method from applying the css color attribute to applying the class, similar to how hiliteClass has been introduced. Using classes instead of css color attributes are essential, because only then we can arrange the prioritizing of overlapped backgrounds via CSS cascading. I mean, if I have my own class applied to a particular column, that changes its background, I want to arrange that alternate background is different from a "normal" alternate. With styles, it's possible (.altClass .myOwnClass { ... }), with CSS color attribute - no.

-=snobo=-

Great little plugin Eric..thanks so much for sharing.

I may be missing something, but is there a way to ban some colums from having a hover state?

i.e i have a 5 column table..and only 3 of the columns should have a hover state.

Thanks in advance for your help :)

Any way to get the plugin to work with different colors in multiple tables on the same page?

Any help would be greatly appreciated.

Jquery 1.3.1 and latest colorizer ..

I am also using tablesorter .. each table has the tablesorter class --
I want to colorize all tables :

$("table").colorize();

gives nothing , but with columns: true , it works (doesn't let me click and select but atleast highlights onmouseover)

Hi, I appreciate all of you who create plugins and widgets because it makes life so much nicer for us non-programmers. I've hacked my way through a few hard coded sites, but now I've been shown WP I don't think I could go back.

Here's a code for animating a paragraph using slide animation, I found this interesting.

//Code for example B
$("input.buttonBslidedown").click(function(){ $("div.contentToChange").find("p.fourthparagraph:hidden").slideDown("slow"); });
$("input.buttonBslideup").click(function(){ $("div.contentToChange").find("p.fourthparagraph:visible").slideUp("slow"); });
//show code example B
$("a.codeButtonB").click(function(){$("pre.codeB").toggle()});

hi

i want to colorize only cells of a table on hover state...

how can i adapt this plugin ?

thx

Thank you for colorize!

I'm using it in my project with small modification. When highlight background is to dark and text colour dark also - it's not visible. So it's my code modification with new option "altTextColor":

jQuery.fn.colorize = function(params) {
options = {
altColor: '#ECF6FC',
bgColor: '#fff',
hoverColor: '#BCD4EC',
hiliteColor: 'yellow',
oneClick: false,
columns: false,
altTextColor: 'white',
banColumns: []
};
jQuery.extend(options, params);

var colorHandler = {
checkHover: function() {
if (!this.onfire) {
this.origColor = this.style.backgroundColor;
this.style.backgroundColor= options.hoverColor;
this.origTextColor = this.style.color;
this.style.color= options.altTextColor;
}
},
checkHoverOut: function() {
if (!this.onfire) {
this.style.backgroundColor=this.origColor;
this.style.color= this.origTextColor;
}
},

When I use the oneClick = true in Version 1.3.0
It has problem about toggle hiliteColor on the same TR row

Thank you & kudos for the great plugin!

Just download the 1.3.0, and wondered why I have a Javascript error when using it... Turns out there's a function call on line 59:

msg.debug(timeDiff.getDiff());


I guess that's a kinda leftover in the code... Apart from that, the plugin works excellent, thanx again!

-=snobo=-

Like all other jQuery alt row colorizers I've looked at so far, it can't handle rowspan properly.

Also, breaks in Firefox if setting hiliteColor:'none' or hoverColor:'none'. I'm only guessing though that this is how we would turn these features off altogether. This works in IE6 but an error is raised.

I would have assumed that the default options would be that these features are turned off, and they should only be enabled if included in the parameter list.

Maybe I'm not understanding something?

I installed the plugin and had it up and running within two minutes! It's seriously great! The only question/feature request I had for the plugin was the ability to only highlight one row at a time onclick. In other words, after clicking a row, when you go to click a new row, the first row that you clicked will default back to its original color and the new row will obtain the hiliteColor.

The plugin is great, I just cant get it to work in the manner I need, ... it does not seem to stop.
I have jQuery.js latest version, and I am currently using jquery.colorize.js for one of my tables on my page. To explain I am calling an ajax.load to a div.id ("#showPanel"). Before the ajax.load, I have a php mysql query creating my table dynamically from a db. So thru jquery I load my URL into div.id("#showpanel"). And this works like a charm. jQuery finest features. But my problem is that when I colorize this dynamic table, ... it leaks into the other html markup, .. and colorize-es my entire page and not just div.id("#showpanel"), .. how can I isolate covorize or tell colorize to stop/remove/
My markup below:
//here is my function that calls the URL where my query makes the dynamic table,...
function setAjaxQuery(urlVar) {
$("#showPanel").load("http://myURL/ajaxfunc.php"+urlVar).show('fast');
};
//here a php switch to complete my url and case for the query selection,...
switch ($_GET['ajaxfunc']){
case transDBQuery :
print transDBQuery($_GET['tablerow']);
break;
//After the switch this function queries my db and creates the table with the results,...
function transDBQuery($transponder){
?>

$('table').colorize(({bgColor:'##BCCAE5', hoverColor:'white', hiliteColor:'#BADEF6'})) ;

<?php

$DBQuery="SELECT * FROM outagedb WHERE network LIKE '%$transponder%' ORDER by id DESC";
$result=mysql_query($DBQuery);
$output = "";
$output .= "StartDateStartTimeEventDevice AffectedNetworkStopDateStopTimeTest";
while ($row=mysql_fetch_array($result))
{
$output .= "$row[startDate]$row[startTime]$row[event]$row[device_aff]$row[network]$row[stopDate]$row[stopTime]$row[outID]";
}
$output .= "";
return $output;
}

OpenTable();
echo "Query Results:";
CloseTable();

This is just one of those one of a kind tools that makes the web even more look like a fullgrown application
I certainly gonna use it

Vinny

This is a great plugin - helpful in making tables readable. Are there any plans to expand the highlighter (say vertical instead of horizontal, and not highlight certain rows?)