Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

getting selected value of radio button in case of action

Hi here is the codes bellow, I've tried many things but I couldnt get value of selected radio button.As you can see I need to get that value for diffrent situations.

  <div style="display: inline-block">
        <div>
                <a href="/Login/LogOut">Log Out</a><span> Welcome </span>YS User 1 noName        </div>
        <br />
        <br />
        <br />
        <br />
        <input type="button" onclick="submitCreate();" value="New Survey" /><br />
        <input type="button" onclick="submitEdit();" value="Edit Survey" /><br />
        <input type="button" onclick="submitDelete();" value="Delete Survey" /><br />
        <input type="button" onclick="submitPreview();" value="Preview Survey" />
    </div>
    <div style="display: inline-block">
<div>
    <table class="MyTable"><thead><tr class="columnHead"><th scope="col"></th><th scope="col"><a href="/User/Index?sort=UserID&amp;sortdir=ASC">CreatedBy</a></th><th scope="col"><a href="/User/Index?sort=CreatedDate&amp;sortdir=ASC">Created Date</a></th><th scope="col"><a href="/User/Index?sort=IsRunning&amp;sortdir=ASC">Is Running</a></th></tr></thead><tbody><tr><td> <input name="selected" id="1" 

      type="radio" value="1" /></td><td>1</td><td>12/12/2011 3:43:57 PM</td><td>False</td></tr><tr class="altRow"><td> <input name="selected" id="2" 

      type="radio" value="2" /></td><td>1</td><td>12/13/2011 4:42:37 PM</td><td>False</td></tr><tr><td> <input name="selected" id="3" 

      type="radio" value="3" /></td><td>1</td><td>12/13/2011 6:27:38 PM</td><td>False</td></tr></tbody></table>
</div>
    </div>
</body>
</html>
<script type="text/javascript">
    //   var value = $$('input[name=selected]:checked')[0].get('value');
//    var selectFoo;
//    $$('input[name=selected]').each(function (el) {
//        if (el.checked == true) {
//            selectFoo = el.value;
//        }
//    });

    function getCheckedValue(radioObj) {
        if (!radioObj)
            return "";
        var radioLength = radioObj.length;
        if (radioLength == undefined)
            if (radioObj.checked)
                return radioObj.value;
            else
                return "";
        for (var i = 0; i < radioLength; i++) {
            if (radioObj[i].checked) {
                return radioObj[i].value;
            }
        }
        return "";
    };

    function submitCreate() {
        var adress = "/User/CreateSurvey/";
        document.location = adress;
    };

    function submitEdit() {
        var adress = "/Den/Index/" + getCheckedValue('selected');
        document.location = adress;
    };

    function submitDelete() {
        var adress = "/User/DeleteSurvey/" + getCheckedValue('selected');
        document.location = adress;
    };

    function submitPreview() {
        var adress = "/User/PreviewSurvey/" + getCheckedValue('selected');
        document.location = adress;
    }; 
</script>
like image 419
serhads Avatar asked Dec 13 '11 16:12

serhads


People also ask

How can I check if a radio button is selected?

Using Input Radio checked property: The Input Radio checked property is used to return the checked status of an Input Radio Button. Use document. getElementById('id'). checked method to check whether the element with selected id is check or not.

How do I get the value of a radio button in react?

To set the default checked value of a radio button in React: Store the radio button value in the state. Initialize the state to the value of the default checked radio button. Set the checked property on each radio button conditionally, e.g. checked={selected === 'yes'} .

Which event is achieved when a radio button is selected?

"CheckedChanged" event is activated when a radiobutton is selected.


2 Answers

You can use document.getElementsByName(<button_name>) or document.getElementsByTagName("input") to get an array of input elements. Loop through those elements to check which is checked.

Here is an example of how to get the value of the checked button from a set of radio buttons with the name "selected":

<html>
    <head>
        <script type="text/javascript">
          function get_radio_value() {
            var inputs = document.getElementsByName("selected");
            for (var i = 0; i < inputs.length; i++) {
              if (inputs[i].checked) {
                return inputs[i].value;
              }
            }
          }

          function onSubmit() {
            var id = get_radio_value();
            alert("selected input is: " + id);
          }
        </script>
    </head>
    <body>
        <form onsubmit="onSubmit();">
            <input name="selected" value="1" type="radio"/>1<br/>
            <input name="selected" value="2" type="radio"/>2<br/>
            <input name="selected" value="3" type="radio"/>3<br/>
            <input type="submit" value="submit"/>
        </form>
    </body>
</html>
like image 140
sudocode Avatar answered Nov 13 '22 07:11

sudocode


I choose let number of code for a required function. The one worked for me is given below from api.jquery.com. Hope this helps others.

HTML

<input type="radio" name="option" value="o1">option1</input>
<input type="radio" name="option" value="o2">option2</input>

JavaScript

var selectedOption = $("input:radio[name=option]:checked").val()

The variable selectedOption will contain the value of the selected radio button (i.e) o1 or o2

like image 23
Malathy Avatar answered Nov 13 '22 08:11

Malathy