Getting selected value from radio button

(JQUERY)


Hi,
In this  article i discuss about how to get the selected value of radio button using jquery.

View:-

@{
    ViewBag.Title = "RadioButton";
}

<h2> RadioButton</h2>

 <script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
    <script src="../../Scripts/jquery-ui-1.8.20.js" type="text/javascript"></script>
    <link href="../../Content/themes/base/jquery-ui.css" rel="stylesheet" />


<input type="button" id="btn_selectedVal" value="Get Selected Fruit" />

 <input type="radio" value="Apple"  name="rdo_fruits" checked="checked" />Apple &nbsp;&nbsp;
 <input type="radio" value="Orange" name="rdo_fruits"  />Orange

<script type="text/javascript">
    $('#btn_selectedVal').click(function () {

        var val = $("input[name='rdo_fruits']:checked").val();

        customDialog("Information", "Selected fruit is:- " + val);
    });

    //jquery custom dialog box to display  exception
    function customDialog(headerValue, message) {
        //remove the existing div
        var divs = $('body').find('div[id="div_customDialog"]');
        $.each(divs, function (index, divItem) {
            $(divItem).remove();
        });

        //add new div
        $('body').append('<div id="div_customDialog"></div>');

        $('#div_customDialog').html(message);

        $('#div_customDialog').dialog({
            draggable: true,
            modal: true,
            resizable: false,
            width: 'auto',
            title: headerValue,
            minHeight: 75,
            buttons: {
                OK: function () {
                    $(this).dialog('close');
                    $(this).dialog('destroy');
                }
            }
        });

        $('#div_customDialog').dialog('open');
    }
</script>


Controller:-

   public ActionResult RadioButton()
        {
            return View();
        }


Image

Ratings


Average Rating: 0.00 by 0 users
Giri Prasad
1/30/2016
1/30/2016
Download PDF

Comments