PDA

View Full Version : Table row rollover with click highlighting script. How to set off lighting?



Samuell
11-21-2007, 02:00 PM
Hello, D-Drivers!
I'm trying to use an advanced script now, I guess this is the most advanced script available for row rollovering purpose.
It also has one useful feature - it can set static highlighting for clicked row. But it can't set it off on second click. I'm trying to make it myself, but I'm actualy not js programmer, so nothing's work =)
So, I think I need help)
Maybe this could be useful for you too.
Anyway, thanks in advance!

Ohh, yeah. The script! It's here - http://www.dhtmlgoodies.com/scripts/highlight-table-row/highlight-table-row.html
I don't know where the index of that demo though, I took script from source code.
Here is a main code -


<script type="text/javascript">
/ ********************************************************************************
****************************
(C) www.dhtmlgoodies.com, November 2005

This is a script from www.dhtmlgoodies.com. You will find this and a lot of other scripts at our website.

Terms of use:
You are free to use this script as long as the copyright message is kept intact. However, you may not
redistribute, sell or repost it without our permission.

Thank you!

www.dhtmlgoodies.com
Alf Magne Kalleland

********************************************************************************
****************************/
var arrayOfRolloverClasses = new Array();
var arrayOfClickClasses = new Array();
var activeRow = false;
var activeRowClickArray = new Array();

function highlightTableRow()
{
var tableObj = this.parentNode;
if(tableObj.tagName!='TABLE')tableObj = tableObj.parentNode;

if(this!=activeRow){
this.setAttribute('origCl',this.className);
this.origCl = this.className;
}
this.className = arrayOfRolloverClasses[tableObj.id];

activeRow = this;

}

function clickOnTableRow()
{
var tableObj = this.parentNode;
if(tableObj.tagName!='TABLE')tableObj = tableObj.parentNode;

if(activeRowClickArray[tableObj.id] && this!=activeRowClickArray[tableObj.id]){
activeRowClickArray[tableObj.id].className='';
}
this.className = arrayOfClickClasses[tableObj.id];

activeRowClickArray[tableObj.id] = this;

}

function resetRowStyle()
{
var tableObj = this.parentNode;
if(tableObj.tagName!='TABLE')tableObj = tableObj.parentNode;

if(activeRowClickArray[tableObj.id] && this==activeRowClickArray[tableObj.id]){
this.className = arrayOfClickClasses[tableObj.id];
return;
}

var origCl = this.getAttribute('origCl');
if(!origCl)origCl = this.origCl;
this.className=origCl;

}

function addTableRolloverEffect(tableId,whichClass,whichClassOnClick)
{
arrayOfRolloverClasses[tableId] = whichClass;
arrayOfClickClasses[tableId] = whichClassOnClick;

var tableObj = document.getElementById(tableId);
var tBody = tableObj.getElementsByTagName('TBODY');
if(tBody){
var rows = tBody[0].getElementsByTagName('TR');
}else{
var rows = tableObj.getElementsByTagName('TR');
}
for(var no=0;no<rows.length;no++){
rows[no].onmouseover = highlightTableRow;
rows[no].onmouseout = resetRowStyle;

if(whichClassOnClick){
rows[no].onclick = clickOnTableRow;
}
}

}
</script>

boogyman
11-21-2007, 02:31 PM
that is a different site... ask on their help forum

jscheuer1
11-21-2007, 02:43 PM
If you don't want to help, that's OK. But in a case like this, you should suggest that the user go elsewhere, not demand it.

Samuell
11-21-2007, 03:30 PM
that is a different site... ask on their help forum
I've done it first. But I have very small hope for help on their forum...

boogyman
11-21-2007, 04:13 PM
If you don't want to help, that's OK. But in a case like this, you should suggest that the user go elsewhere, not demand it.

sorry wrong use of wordage... I didnt mean for it to be "demanding". I left out please :( please accept my apologies Samuell and John

the demo page for that script is
http://www.dhtmlgoodies.com/index.html?whichScript=highlight-table-row

although it doesnt appear to offer any help :confused:
I am at work at the moment but I will be going to lunch in about an hour, and I will take a more in depth look at the script then if no one else has.

boogyman
11-25-2007, 06:18 PM
I took a fresh look at this script when I got home, and I again yesterday after I got back from the holiday, and I cannot seem to figure out how it is assigning the class to the table row.


function clickOnTableRow()
{
var tableObj = this.parentNode;
if(tableObj.tagName!='TABLE')tableObj = tableObj.parentNode;

if(activeRowClickArray[tableObj.id] && this!=activeRowClickArray[tableObj.id]){
activeRowClickArray[tableObj.id].className='';
}
this.className = arrayOfClickClasses[tableObj.id];

activeRowClickArray[tableObj.id] = this;

}


If you follow the process this function is where the assigning happens but my lack of javascript indepth knowledge prevents me from getting further. I am assuming that tableObj.id is the array key of the table row, but no where in the script do I see the ID variable being delared. so maybe someone with more javascript expertise can help you deal with that function... although I believe it should probably be a toggle function not just a click function as it appears to be set up presently.