Skip to content

docs(RadioGroup): update focus documentation #2903

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Apr 16, 2025
Merged

docs(RadioGroup): update focus documentation #2903

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f781fb9
docs(RadioGroup): update focus documentation
Tsvetomir-Hr Apr 8, 2025
5804d72
Update components/radiogroup/overview.md
Tsvetomir-Hr Apr 16, 2025
46cb48e
Update components/radiogroup/overview.md
Tsvetomir-Hr Apr 16, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 7 additions & 7 deletions components/radiogroup/overview.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,13 +103,12 @@ See the [Input Validation](slug:common-features/input-validation) article for mo

## RadioGroup Reference and Methods

The RadioGroup provides a `FocusAsync` method that allows the application to focus the component programmatically. First, obtain reference to the component through its `@ref` attribute.
@[template](/_contentTemplates/common/inputs.md#focus-kb)
The RadioGroup provides a `FocusItemAsync` method that allows the application to focus a specific radio input programmatically. It accepts an integer parameter representing the index of the radio button you want to focus. To use it, obtain the component reference through its `@ref` attribute.

>caption Using RadioGroup methods
>caption Using RadioGroup `FocusItemAsync` method

````RAZOR
<TelerikButton OnClick="@FocusRadioGroup">Focus RadioGroup</TelerikButton>
<TelerikButton OnClick="@FocusLastRadioItem">Focus Last Radio Item</TelerikButton>

<TelerikRadioGroup @ref="@RadioGroupRef"
Data="@RadioGroupData"
Expand All @@ -119,7 +118,7 @@ The RadioGroup provides a `FocusAsync` method that allows the application to foc
</TelerikRadioGroup>

@code{
private TelerikRadioGroup<ListItem, int?> RadioGroupRef { get; set; }
private TelerikRadioGroup<ListItem, int?>? RadioGroupRef { get; set; }

private int? RadioGroupValue { get; set; }

Expand All @@ -129,9 +128,10 @@ The RadioGroup provides a `FocusAsync` method that allows the application to foc
new ListItem { Id = 3, Text = "Baz" }
};

private async Task FocusRadioGroup()
private async Task FocusLastRadioItem()
{
await RadioGroupRef.FocusAsync();
// focus last radio item
await RadioGroupRef!.FocusItemAsync(2);
}

public class ListItem
Expand Down
Loading