Okay, det blev en "deLuxe" løsning, men den virker :-)
<HTML>
<HEAD>
<TITLE>373088: Aktivering af Radiobutton via Javascript</TITLE>
<script language="javascript" type="text/javascript">
<!--
var oSelectedRow;
function setRadio()
{
// Der klikkes på et childElement fra en TR, ergo må
// vi have fat i parentNode
var oRow = event.srcElement.parentNode;
var cInputTagsInRow = oRow.getElementsByTagName('input');
var sEventType = event.type;
// click funktion
if (sEventType=='click')
{
var iFound = -1;
for(var i=0; ((iFound<0) && (i<cInputTagsInRow.length)); i++)
{
if (cInputTagsInRow[i].type.toLowerCase()=='radio')
{
iFound = i;
cInputTagsInRow[i].checked = true;
}
}
if (oSelectedRow)
{
oSelectedRow.selected = false;
oSelectedRow.className = 'allowSelect';
}
oRow.className = 'allowSelected';
oRow.selected = true;
oSelectedRow = oRow;
}
// mouseover funktion
if (sEventType=='mouseover')
{
oRow.className = 'allowSelectHover';
};
// mouseout funktion
if (sEventType=='mouseout')
{
oRow.className = (oRow.selected) ? 'allowSelected' : 'allowSelect';
};
}
function activateSelectableRows()
{
// De tableRows (TR) der er af CSS classen "allowSelect"
// Skal tilføjes event "onclick" - jeg har også tilføjet
// en "hover" funktion - som du dog ikke har spurt efter...
var cRows = document.getElementsByTagName('tr');
for(var i=0; (i<cRows.length); i++)
{
if (cRows[i].className=='allowSelect')
{
cRows[i].onclick = setRadio;
cRows[i].onmouseover = setRadio;
cRows[i].onmouseout = setRadio;
}
}
};
window.onload = activateSelectableRows;
function init()
{
activateSelectableRows();
};
//-->
</script>
<style>
.allowSelect {cursor: hand}
.allowSelected {background-color: #eef}
.allowSelectHover {cursor: hand; background-color: #aae}
td,th {text-align: left}
.pris {text-align: right}
</style>
</HEAD>
<BODY >
<table border="0" cellpadding="0" cellspacing="0" width="500">
<tr onclick="setRadio(this)">
<th>Valgt</td>
<th>VareNr</td>
<th>Beskrivelse</td>
<th class="pris">Pris</td>
</tr>
<tr class="allowSelect" onclick="setRadio(this)">
<td><input type="radio" name="radioGroup" value="r1"></td>
<td>TYND006</td>
<td>Den næst hurtigste computer</td>
<td class="pris">255,00</td>
</tr>
<tr class="allowSelect" onclick="setRadio(this)">
<td><input type="radio" name="radioGroup" value="r1"></td>
<td>FED112</td>
<td>Den hurtigste computer</td>
<td class="pris">355,00</td>
</tr>
<tr class="allowSelect" onclick="setRadio(this)">
<td><input type="radio" name="radioGroup" value="r1"></td>
<td>TYK333</td>
<td>Er du <b>så</b> færdig?!</td>
<td class="pris">1355,00</td>
</tr>
</table>
</BODY>
</HTML>
Ny bruger
Nybegynder
Opret
Preview
