By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,636 Members | 1,213 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,636 IT Pros & Developers. It's quick & easy.

Clicking anywhere on report row

P: n/a
I have a HTML table with onmouseover/onmouseout event handlers to
change the bgcolor of the report row as the mouse moves over it.

The row also has a radio button on it.

Is there a way to click anywhere on the row and have the radiobutton be
clicked?

By attaching a onClick on the TR and having it bubble up (down?) to the
radio element or something?

Thanks

Sep 23 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
OK got it working

Added a onClick event handler to the TR tag

<tr onClick="ClickRadio(this);">

Do I need to worry about the onClick event bubbling up to higher
elements? Do I need to do the cancelPropagation and stuff?

<script type="text/javascript">
function ClickRadio(p_tr)
{
var l_element;
for( var ii = 0; ii < p_tr.childNodes.length; ii++ ) {
if (p_tr.childNodes[ii].tagName=="TD") {
for (var j=0; j< p_tr.childNodes[ii].childNodes.length;j++)
{
l_element=p_tr.childNodes[ii].childNodes[j];
if (l_element.tagName=='INPUT' &&
l_element.type=="radio") {
l_element.checked=true;
}
}
}
}
}
</script>

Works like a charm.

Hope this helps someone.

Sep 23 '05 #2

P: n/a
us****@vikas.mailshell.com wrote:
OK got it working

Added a onClick event handler to the TR tag

<tr onClick="ClickRadio(this);">

Do I need to worry about the onClick event bubbling up to higher
elements? Do I need to do the cancelPropagation and stuff?
Only if you want to prevent a click on your row from firing some other
onclick higher up the DOM.

<script type="text/javascript">
function ClickRadio(p_tr)
{
var l_element;
for( var ii = 0; ii < p_tr.childNodes.length; ii++ ) {
if (p_tr.childNodes[ii].tagName=="TD") {
for (var j=0; j< p_tr.childNodes[ii].childNodes.length;j++)
{
l_element=p_tr.childNodes[ii].childNodes[j];
if (l_element.tagName=='INPUT' &&
l_element.type=="radio") {
l_element.checked=true;
}
If you want to just check the radio button in the row, and presuming
p_tr is a reference to a row element, try:

var inputs = p_tr.getElementsByTagName('input');
var el, i = inputs.length;
while (i--){
el = inputs[i]
if ( el.type = 'radio' ){
el.checked = true;
}
}

}
}
}
}
</script>

Works like a charm.

Hope this helps someone.

--
Rob
Sep 24 '05 #3

P: n/a
RobG wrote:
[...]
var inputs = p_tr.getElementsByTagName('input');
var el, i = inputs.length;
while (i--){
el = inputs[i]
if ( el.type = 'radio' ){
That should of course be:

if ( el.type == 'radio' ){
el.checked = true;
}
}

[...]
--
Rob
Sep 24 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.