In this article I will explain with an example, how to get value of checked (selected) RadioButton using jQuery in ASP.Net Core MVC.
 
 
Namespaces
You will need to import the following namespace.
using Microsoft.AspNetCore.Mvc.Rendering;
 
 
Model
This article uses SelectListItem class as Model which is an in-built ASP.Net Core MVC class. It has all the properties needed for populating a RadioButtonList.
 
 
Controller
The Controller consists of the following Action method.
Action method for handling GET operation
Inside this Action method, a generic list of SelectListItem class is created with some Fruit values.
The Fruit Name is stored in the Text property while the Fruit Id is stored in the Value property.
Finally, the list of Fruits is returned to the View.
public class HomeController : Controller
{
    public IActionResult Index()
    {
        List<SelectListItem> items = new List<SelectListItem>();
        items.Add(new SelectListItem { Text = "Mango", Value = "1" });
        items.Add(new SelectListItem { Text = "Orange", Value = "2" });
        items.Add(new SelectListItem { Text = "Banana", Value = "3" });
        items.Add(new SelectListItem { Text = "Apple", Value = "4" });
        items.Add(new SelectListItem { Text = "Papaya", Value = "5" });
        return View(items);
    }
}
 
 
View
Inside the View, in the very first line the generic list of SelectListItem class is declared as Model for the View.
Populating List of RadioButtons
Inside the View, a loop is executed over the generic list of SelectListItem class which in turn generates a list containing HTML RadioButtons and HTML Label elements.
Below the RadioButtons, there is a Submit Button.
 
Displaying checked (selected) value using jQuery
Inside the jQuery document.ready event handler, the Submit Button has been assigned with a jQuery click event handler.
When the Submit Button is clicked, first the reference of the RadioButton which is checked is determined.
The Text part is determined from the associated Label element is selected using this reference and its Text part is appended to a JavaScript variable message.
Finally, the selected Fruit name is displayed using JavaScript Alert Message Box.
@model List<SelectListItem>
 
@{
    Layout = null;
}
 
<!DOCTYPE html>
 
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <style type="text/css">
        body { font-family: Arial; font-size: 10pt; }
    </style>
</head>
<body>
    <table id="tblFruits">
        @foreach (var fruit in Model)
        {
            <tr>
                <td><input id="@fruit.Value" type="radio" name="Fruit" value="@fruit.Value" checked="@fruit.Selected" /></td>
                <td><label for="@fruit.Value">@fruit.Text</label></td>
            </tr>
        }
    </table>
    <br/>
    <input id="btnSubmit" type="button" value="Submit" />
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#btnSubmit").click(function () {
                var message = "";
                var checkedRadio = $("#tblFruits input[type=radio]:checked");
                if (checkedRadio.length > 0) {
                    message += "Selected Fruit: ";
                    message += checkedRadio.parent().next().find("label").html();
                }
                alert(message);
            });
        });
    </script>
</body>
</html>
 
 
Screenshot
ASP.Net Core MVC: Get values of checked (selected) RadioButton using jQuery
 
 
Downloads
Download Code