• 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
    • ListBox
    • 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

Globalization

The globalization process combines the translation of component messages with adapting them to specific locales.

For more information on how globalization practices are implemented in KendoReact, refer to the overview article. For more information on the globalization aspects which are available for each component, refer to the article on globalization support.

The following example demonstrates how to show the value as a culture-specific currency in the available Inputs components and how to localize their built-in messages.

Example
View Source
Change Theme:

Internationalization

The internationalization process applies specific culture formats to a web application.

For more information, refer to:

Messages

The Inputs support the localization of their messages by utilizing the KendoReact Internationalization package.

The following table lists the built-in message keys and their default values.

Message KeyDefault Value
numerictextbox.incrementIncrease value
numerictextbox.decrementDecrease value
slider.incrementIncrease
slider.decrementDecrease
slider.dragTitleDrag
colorGradient.hexhex
colorGradient.rr
colorGradient.gg
colorGradient.bb
colorGradient.aa
colorGradient.contrastRatioContrast ratio
colorGradient.colorGradientAALevelAA
colorGradient.colorGradientAAALevelAAA
colorGradient.colorGradientPassPass
colorGradient.colorGradientFailFail
colorGradient.hueSliderLabelHue slider
colorGradient.alphaSliderLabelAlpha slider
colorGradient.toggleInputsButtonToggle colorgradient inputs
flatColorPicker.cancelBtnCancel
flatColorPicker.applyBtnApply
flatColorPicker.colorGradientBtnColor Gradient view
flatColorPicker.colorPaletteBtnColor Palette view
flatColorPicker.clearBtnClear color value
checkbox.validationPlease check this box if you want to proceed!
checkbox.optionalText(Optional)
radioButton.validationPlease select option if you want to proceed!
switch.validationPlease turn on if you want to proceed!
colorPicker.dropdownButtonAriaLabelSelect
rating.ariaLabelRating
signature.clearClear
signature.maximizeMaximize
signature.minimizeMinimize

Right-to-Left Support

The following example demonstrates how to utilize the RTL support for the Inputs.

Example
View Source
Change Theme: