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

passing checked value of radio button to js function from form submit

P: n/a
The following (likely far from imperfect code), reports a value of NaN
in the j4 display. I suppose the problem is I am not really passing
the "checked" value of the radio button via .value ... without having
to get this value via html, is there any way I can passed the checked
value via html .. maybe with syntax like n4.checked.value or
something..

Many thanks.

<html>
<body>
WIDTH: <input type=text name=n1 value=5>
<br>
LENGTH:<input type=text id=n2 value=10>
<br>
EXTRA:<input type=text id=n3 value=20>
<br>
<br>
CHOOSE STYLE:
<br>

<input type="radio" checked name=n4 value=3>Green
<input type="radio" name=n4 value=5>Red
<input type="radio" name=n4 value=7>Blue

<br>
<br>
<input type=button value="Calulate Estimate"
onclick="mmm(n1.value,n2.value,n3.value,n4.value)" >
<br>
<br>
<br>
<br>
TOTAL COST:
<input type=text id=t value=0>
<script defer>
function mmm(x1,x2,x3,x4) {
var j1 = +x1;
var j2 = +x2;
var j3 = +x3;
var j4 = +x4;
alert(j4);
var d=document;
var el=d.getElementById("t");
el.value=Math.round(((j1*j2)+j3)*j4);
}
</script>

</body>
</html>
Jul 23 '05 #1
Share this Question
Share on Google+
2 Replies


P: n/a
> <html>
<body>
First of all: Please add a <form> tag here.
WIDTH: <input type=text name=n1 value=5>
<br>
LENGTH:<input type=text id=n2 value=10>
<br>
EXTRA:<input type=text id=n3 value=20>
<br>
<br>
CHOOSE STYLE:
<br>

<input type="radio" checked name=n4 value=3>Green
<input type="radio" name=n4 value=5>Red
<input type="radio" name=n4 value=7>Blue

<br>
<br>
<input type=button value="Calulate Estimate"
onclick="mmm(n1.value,n2.value,n3.value,n4.value)" >
You should better use document.forms[0].n1.value instead of n1.value, and so
on
<br>
<br>
<br>
<br>
TOTAL COST:
<input type=text id=t value=0>
Please add the closing </form> tag here.
<script defer>
You can't directly access the radio button value on the same web site. n4 is
an array of three values here. In order to get the current value, implement
the following function:
function radioValue(radio) {
var i;
for (i=0; i<radio.length; i++)
if (radio[i].checked)
return radio[i].value;
// otherwise no radio button of the radio button group is selected
return "undefined";
}
function mmm(x1,x2,x3,x4) {
var j1 = +x1;
var j2 = +x2;
var j3 = +x3;
var j4 = +x4;
alert(j4);
var d=document;
var el=d.getElementById("t");
You should only calculate the total cost, if one of the radio buttons was
selected. So add here:
if (radioValue(document.forms[0].n4) != "undefined")
el.value=Math.round(((j1*j2)+j3)*j4);
}
</script>

</body>
</html>
Finally change the following line onclick="mmm(n1.value,n2.value,n3.value,n4.value)" >

to that one:
onclick="mmm(document.forms[0].n1.value,document.forms[0].n2.value,document.
forms[0].n3.value,radioValue(document.forms[0].n4))">

Nice greetings from
Thomas
Jul 23 '05 #2

P: n/a
I figured out the below, found a function on this very forum that sets
the value of the checked radio.

function returnSelection(theRadio) {
var selection=null;
for(var i=0; i < theRadio.length; i++) {
if(theRadio[i].checked) {
selection=theRadio[i].value;
return selection;
}
} return selection;
}

Thanks.

ja***@cyberpine.com wrote in message news:<ef**************************@posting.google. com>...
The following (likely far from imperfect code), reports a value of NaN
in the j4 display. I suppose the problem is I am not really passing
the "checked" value of the radio button via .value ... without having
to get this value via html, is there any way I can passed the checked
value via html .. maybe with syntax like n4.checked.value or
something..

Many thanks.

<html>
<body>
WIDTH: <input type=text name=n1 value=5>
<br>
LENGTH:<input type=text id=n2 value=10>
<br>
EXTRA:<input type=text id=n3 value=20>
<br>
<br>
CHOOSE STYLE:
<br>

<input type="radio" checked name=n4 value=3>Green
<input type="radio" name=n4 value=5>Red
<input type="radio" name=n4 value=7>Blue

<br>
<br>
<input type=button value="Calulate Estimate"
onclick="mmm(n1.value,n2.value,n3.value,n4.value)" >
<br>
<br>
<br>
<br>
TOTAL COST:
<input type=text id=t value=0>
<script defer>
function mmm(x1,x2,x3,x4) {
var j1 = +x1;
var j2 = +x2;
var j3 = +x3;
var j4 = +x4;
alert(j4);
var d=document;
var el=d.getElementById("t");
el.value=Math.round(((j1*j2)+j3)*j4);
}
</script>

</body>
</html>

Jul 23 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.