0

hey guys,
I want to make a table but i want the first column of the table to have a radio button. On clicking the radio button i want the user to go to another page.
Please suggest some ideas or some coding which could help me.

2
Contributors
2
Replies
4
Views
9 Years
Discussion Span
Last Post by anuj_sharma
1

Heres how it goes, just dont forget to change the URL values' assigned to the radio buttons. Enjoy coding...

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<title>Associating links with radio button</title> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css"> 
<!-- 

/* i throw in some style  attribution on this one, i know it look so lame! So youll have to modify this according to your taste. */

form { margin:0; } 
form table { width: 200px; text-align: left; margin: 2px; background-color: #A6A6A6; } 
form caption { background-color: #000000; font-weight: bold; color: #C0C0C0; padding: 2px; }
form td  { background-color: #C0C0C0; color: #000000; padding-top: 2px; }
form th { color: #FFFFFF; magin: 0 auto; }
--> 
</style>
<script type="text/javascript"> 
<!-- BEGIN HIDING

//Here's the code you need
//with the onclick event the
//user will be set to another
// location of your choice. 

document.onclick = function(_radio)
{ _radio = _radio ? _radio : window.event;
var _target = _radio.target ? _radio.target : _radio.srcElement; 

if (( _target.name ) && ( _target.name == 'nav' ) && ( _target.checked )) { window.location = _target.value; 
  }
} 
// DONE HIDING -->
</script>
</head>
<body>
<form action="#" onSubmit="return false">
<table>
<caption>Select Location</caption>
<thead>
<tr>
<th scope="col">Location1</th>
<th scope="col">Location2</th></tr></thead></tr>
<td colspan="2">
<label for="r1">
<input id="r1" name="nav" value="http://www.your1stpage.com" type="radio" />Home</td>
<td>
<label for="r2">

<!-- Set The Desired URL value of your choice -->

<input id="r2" name="nav" value="http://www.your2ndpage.com" type="radio" />Downloads</td></tr>
</table>
</form>
</body>
</html>
Votes + Comments
Just what i wanted
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.