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.
1. You can easily put the radio button in the first column of the table. That's straightforward html.
2. For the redirecting the user to another page you would have to resort to javascript. Our buddies in forum216 can advise you on that.
I would however rethink the design. Clicking on a radio button does not imply redirecting to another page for most users. You're tampering with the default behaviour of radio buttons and that could upset some users.
Second, the only way you can achieve this effect is by employing javascript. In this way you're alienating certain users from navigating your site, most notably search engine robots.
Thirdly, any input elements should really be inside a form, so you have to deal with that as well. You could wrap the form around the whole table, but this might not be possible.
If clicking on a radio button will simply act as a link, I would suggest you rather use a regular link and style it so it looks similar to a radio button.
This is not a coding service. This is a forum where computer professionals help other computer professionals with specific issues. Teaching you how to put input elements inside table cells falls out of scope of this site.
I'm going to have to agree with Vrag, Putting elements doesn't change with location. Meaning if you know how to place an input element outside of a table you can put one inside the table just the same.
Just as a tip put the input element code i.e the <input type=radio...> between the cell tags in the table. i.e <td></td>
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
Please show some knowledge and initiative. Once again, this is not a coding service. We're here to help you, not to do things for you.
What have you tried (show us the code) and how is it not working? And, have you looked at the beginners' HTML tutorial? Sounds like you could benefit from it.
<html>
<head>
<title>Associating links with radio button</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
<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><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><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.
This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
By continuing to use this site, you are consenting to our use of cookies.