jQuery & JavaScript

Validate an ASP.NET RadioButtonList (validators, JavaScript and jQuery)

jQuery & JavaScript · By the Postback Notes editorial team · Published 2026-08-22

Unlike the CheckBoxList, a RadioButtonList has a single value (the selected item, or nothing), so a RequiredFieldValidator can validate it directly. Script is only needed for conditional rules or for checks outside the validation framework.

The simple case

<fieldset>
    <legend>Delivery</legend>
    <asp:RadioButtonList ID="rblDelivery" runat="server" RepeatLayout="Flow">
        <asp:ListItem Value="std">Standard (3–5 days)</asp:ListItem>
        <asp:ListItem Value="exp">Express (next day)</asp:ListItem>
        <asp:ListItem Value="pick">Pick up in store</asp:ListItem>
    </asp:RadioButtonList>
</fieldset>
<asp:RequiredFieldValidator runat="server" ControlToValidate="rblDelivery"
    ErrorMessage="Choose a delivery method." Display="Dynamic" />

Do not mark an item as Selected by default if you want to force a conscious choice. The list renders radio inputs sharing one name (for example ctl00$MainContent$rblDelivery) and ids …rblDelivery_0, _1, _2.

Reading the choice in plain JavaScript

function selectedDelivery() {
  var list = document.getElementById("<%= rblDelivery.ClientID %>");
  var checked = list.querySelector("input[type=radio]:checked");
  return checked ? checked.value : null;
}

The same with jQuery

function selectedDelivery() {
  return $("#<%= rblDelivery.ClientID %> input:radio:checked").val() || null;
}

Both return the item's Value ("std", "exp", "pick"), or null if nothing is selected.

A conditional rule with a CustomValidator

Store pick-up requires choosing a store from a list:

<asp:DropDownList ID="ddlStore" runat="server" AppendDataBoundItems="true">
    <asp:ListItem Value="" Text="-- store --" />
</asp:DropDownList>
<asp:CustomValidator runat="server" ErrorMessage="Choose a store for pick-up." Display="Dynamic"
    ClientValidationFunction="validateStore" OnServerValidate="cvStore_ServerValidate" />
<script>
  function validateStore(source, args) {
    args.IsValid = selectedDelivery() !== "pick" ||
                   document.getElementById("<%= ddlStore.ClientID %>").value !== "";
  }
</script>

protected void cvStore_ServerValidate(object source, ServerValidateEventArgs args)
{
    args.IsValid = rblDelivery.SelectedValue != "pick" || ddlStore.SelectedValue != "";
}

Showing or hiding the store list when the delivery choice changes is a nice touch: listen for change on the radio inputs and toggle the list's container. Hidden or not, the server rule stays.

Server side

rblDelivery.SelectedValue is an empty string when nothing is selected, and SelectedItem is null. Check Page.IsValid in the button handler before using them.

Related: Validate a CheckBoxList, Validate a DropDownList.

Common mistakes

• Setting Selected="true" on an item while also requiring a choice: the validator can never fail, and users may submit the default without noticing.
• Reading rblDelivery.SelectedItem.Text without checking for null when validation is bypassed by a button with CausesValidation="false".
• Selecting input:radio:checked on the whole page when several RadioButtonLists exist: always scope the selector to the list's container.
• Showing an error in red only: give the validator a clear text message and keep it close to the group.

Official documentation

• Microsoft Learn: RadioButtonList, RequiredFieldValidator
• MDN: <input type="radio">