Solved

radio button value

Posted on 2016-10-29
3
78 Views
Last Modified: 2016-10-31
If an html page contains several radio buttons with the same name (but different values) and NONE is selected (checked), is the value of the radio button element null?

For example, in a form named "st", radio button name "pid", does document.st.pid.value == ""?
0
Comment
Question by:Richard Korts
  • 2
3 Comments
 
LVL 42

Accepted Solution

by:
Rob Jurd, EE MVE earned 500 total points
ID: 41865445
if none are selected then yes it's null (not empty string)

What happens for you when you try it?
0
 
LVL 54

Expert Comment

by:Julian Hansen
ID: 41865471
It's more than null it is not defined.

Consider this code
<form action="reflect.php" method="post">
   <input type="radio" name="testradio" value="1" />
   <input type="radio" name="testradio" value="2" />
   <input type="radio" name="testradio" value="3" />
   <input type="submit">Submit</input>
</form>

Open in new window

reflect.php
<?php
echo "<pre>" . print_r($_POST, true) . "</pre>";

Open in new window


If you don't click any radios you get an empty $_POST array.

There is a trick you can do to get around this

<form action="reflect.php" method="post">
   <input type="radio" name="testradio" value="0" checked />
   <input type="radio" name="testradio" value="1" />
   <input type="radio" name="testradio" value="2" />
   <input type="radio" name="testradio" value="3" />
   <input type="submit">Submit</input>
</form>

Open in new window


In the above we add a 4th input that acts as a default. This is checked by default and if no other buttons are selected then you get a value of 0 coming through.

You can optionally hide this additional radio with styling so it is not visible. It can be useful though if you want the option to de-select a radio - i.e. being able to "change your mind" after clicking a radio to effectively be "none of the above" = which is not practically possible with a standard bank of radio buttons showing only available answers where "changed my mind" would require being able to click "off" a selected radio the way you would a checkbox.
0
 
LVL 42

Expert Comment

by:Rob Jurd, EE MVE
ID: 41865481
yes on the server side it will not come through (checkboxes) are the same.

Another trick is to include a hidden element with the default value:

<form action="reflect.php" method="post">
   <input type="hidden" name="testradio" value="0"  />
   <input type="radio" name="testradio" value="1" />
   <input type="radio" name="testradio" value="2" />
   <input type="radio" name="testradio" value="3" />
   <input type="submit">Submit</input>
</form>

Open in new window


However, you are correct that on the client side it will be returned as the empty string "", not null
0

Featured Post

PRTG Network Monitor: Intuitive Network Monitoring

Network Monitoring is essential to ensure that computer systems and network devices are running. Use PRTG to monitor LANs, servers, websites, applications and devices, bandwidth, virtual environments, remote systems, IoT, and many more. PRTG is easy to set up & use.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Disable Security Alert  popup in Winforms  embedded webbrowser. 1 29
Html test in IIS 4 20
alert(innerHTML); 8 15
how can i make 2 columns? 4 14
This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …

773 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question