• What is KendoReact
  • Getting Started
  • Server Components
  • Components
    • Animation
    • Barcodes
    • Buttons
    • Chartsupdated
    • Common Utilities
    • Conversational UIupdated
    • Data Gridupdated
    • Data Query
    • Data Tools
    • Date Inputs
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Formupdated
    • Ganttupdated
    • Gauges
    • Indicators
    • Inputsupdated
    • Labels
    • Layoutupdated
    • ListBoxupdated
    • ListView
    • Map
    • Notification
    • OrgChartnew
    • PDF Processing
    • PDFViewer
    • PivotGrid
    • Popup
    • Progress Bars
    • Ripple
    • Scheduler
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • TaskBoard
    • Tooltips
    • TreeList
    • TreeViewupdated
    • Upload
  • Sample Applications
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Changelog
  • Updates
  • Troubleshooting

KendoReact RadioButton Overview

The KendoReact RadioButton lets the user to choose only one from multiple options.

The RadioButton is designed to replace the <input type="radio"> HTML5 tag and provides the KendoReact specific styling.


The RadioButton is typically used within a RadioGroup with the same name attribute. All regular input type="radio" HTML attributes are applicable.

The KendoReact RadioButton component is part of the KendoReact library of React UI components. It is distributed through NPM under the kendo-react-inputs package.

The following example demonstrates the RadioButton component in action.

Example
View Source
Change Theme:

The RadioButton is part of the KendoReact Inputs component library. The procedures for installing, importing, and using all components in the library are identical. To learn how to use the RadioButton and the rest of the components in the package, see the Getting Started with the KendoReact Inputs guide.

Key Features

  • Disabled RadioButton—You can render a disabled RadioButton and keep it disabled until certain requirements are met.
  • Labels—You can add labels and set their position. The RadioButton supports custom labels as well.
  • Globalization—The KendoReact RadioButton comes with globalization features that allow you to create applications that can be used all over the world.

To learn more about the appearance, anatomy, and accessibility of the RadioButton, visit the Progress Design System documentation—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.

In this article

Not finding the help you need?