Hi folks!
I've got a problem with javascript and DOM.
I want to create a simple "intelligent" <table>, inside a data-form.
I'd like to do:
- Change color of any <tron onMouseOver DOM event;
- Check a checkbox on click on a <trand change <trbackground color.
Do you ever use phpMyAdmin? Well, the effect i'd like to get it's the
same that it's used in phpMyAdmin's tables. I try to look at phpMyAdmin
source code... But it's too difficult for me. ;-)
Let me show you my simple example file (in php format)...
- - - - - -
<html>
<head>
<title>test page</title>
<style type="text/css">
tr.even { background-color:#e5e5e5; }
tr.odd { background-color:#d5d5d5; }
tr.line_over { background-color:#ccffcc; }
tr.line_selected { background-color:#ffcc99; }
</style>
<script type="text/javascript">
<!--
function select_line(pForm,pObj,index)
{
var elem = pForm[pObj + '[]'];
elem[index].checked = !elem[index].checked;
}
function mouseOutRow(pForm,pRow,pObj,index,class)
{
var elem = pForm[pObj + '[]'];
if(elem[index].checked == true)
{
pRow.className='line_selected';
}
else
{
pRow.className=class;
}
}
// -->
</script>
</head>
<body>
<form name="myForm">
<table>
<tr>
<td> </td>
<td>#</td>
<td>value</td>
</tr>
<?
for($i=0;$i<10;$i++)
{
?>
<tr name="tr_line[]"
class="<? if($i%2==0) { print "even"; } else { print
"odd"; } ?>"
onClick="select_line(document.myForm,'px',<? print $i;
?>);"
onMouseOver="this.className='line_over';"
onMouseOut="mouseOutRow(document.myForm,this,'px', <?
print $i; ?>,'<?
if($i%2==0) { print "even"; } else { print "odd"; } ?>');">
<td width="25"><input type="checkbox" name="px[]" /></td>
<td width="25"><? print $i+1; ?></td>
<td>test row</td>
</tr>
<?
}
?>
</table>
</form>
</body>
</html>
- - - - - -
With Firefox it works fine; but it doesn't work with Internet Explorer!
IE seems to don't use javascript functions in DOM events of <trtag: I
try to set only .style.background-color in "onMouseOut" and other
events... It work!
I don't understand why this... Maybe I can't use these DOM events on
<trtag? Or I mistake something?
Please, try to help me if you can!
In alternative, do you know another way to do my tables?
Thanks a lot, folks!
