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

Discussion in 'Javascript' started by jason@cyberpine.com, Nov 6, 2004.

  1. Guest

    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>
    , Nov 6, 2004
    #1
    1. Advertising

  2. > <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.checked)
    return radio.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
    Thomas Hoheneder, Nov 7, 2004
    #2
    1. Advertising

  3. Guest

    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.checked) {
    selection=theRadio.value;
    return selection;
    }
    } return selection;
    }

    Thanks.

    wrote in message news:<>...
    > 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>
    , Nov 7, 2004
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Hiten
    Replies:
    1
    Views:
    612
    Vidar Petursson
    May 26, 2004
  2. BobbyMy
    Replies:
    0
    Views:
    185
    BobbyMy
    Aug 27, 2005
  3. John E
    Replies:
    2
    Views:
    1,160
    Lasse Reichstein Nielsen
    Jul 3, 2003
  4. Lukelrc
    Replies:
    3
    Views:
    133
    Luke Curtis
    Jun 9, 2004
  5. John E
    Replies:
    2
    Views:
    303
    Lasse Reichstein Nielsen
    Jul 3, 2003
Loading...

Share This Page