syncfusion-blazor-toolkit-buttons

Implement Syncfusion Blazor Toolkit SfButton and SfButtonGroup components with correct event and accessibility patterns.

19|8|Updated May 12, 2026
One-click install
npx skills add https://github.com/syncfusion/blazor-toolkit --skill syncfusion-blazor-toolkit-buttons-syncfusion
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: syncfusion-blazor-toolkit-buttons
Source: https://github.com/syncfusion/blazor-toolkit/tree/main/.github/skills/syncfusion-blazor-toolkit-buttons
Command: npx skills add https://github.com/syncfusion/blazor-toolkit --skill syncfusion-blazor-toolkit-buttons-syncfusion

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires Syncfusion.Blazor.Toolkit, and includes references (resource) components.

What problem does it solve? Blazor developers frequently misuse Syncfusion Toolkit button components — writing async void click handlers, assuming Disabled auto-clears, nesting buttons inside anchors, or misconfiguring button group selection — leading to silent exceptions, stuck UI states, and accessibility violations. ## Core Features & Use Cases - SfButton implementation guidance: Covers Content, IconCss, IsPrimary, Disabled, toggle behavior, form button types, and correct async OnClick patterns with busy-flag management. - SfButtonGroup selection patterns: Single and multiple selection modes, vertical orientation, inner Button properties, and manual Selected/SelectedChanged state tracking. - Anti-pattern workflows: Four documented bad-to-correct workflows for common mistakes like async void handlers, anchor-wrapped buttons, and nullable Disabled bindings. - Use Case: You are building a Blazor Server form with a submit button and a formatting toolbar. Use this Skill to wire an async submit handler that disables during processing and to configure a multi-selection SfButtonGroup with proper validation. ## Quick Start Ask the AI to add a Syncfusion SfButton with an async click handler and a multi-select SfButtonGroup to your Blazor page following this skill's patterns.

Frequently Asked Questions about syncfusion-blazor-toolkit-buttons

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I handle SfButton click events in Blazor?▼

Bind the OnClick parameter to a method accepting MouseEventArgs, using async Task rather than async void so Blazor's dispatcher catches exceptions and re-renders correctly. Manage a busy flag with try/finally to prevent duplicate submissions.

How do I use SfButtonGroup single and multiple selection modes?▼

Set the Mode parameter to SelectionMode.Single for mutually exclusive options or SelectionMode.Multiple for independent toggles. Track state manually via each inner Button's Selected property and SelectedChanged callback, since Multiple mode permits empty selection.

Does SfButton work in Blazor Static SSR render mode?▼

Yes, SfButton renders in all render modes including Static SSR. However, OnClick event handlers require an interactive render mode such as Server or WebAssembly, so check the project's interactivity configuration before wiring handlers.

Why does my SfButton stay disabled after the click handler finishes?▼

The Disabled property is one-way and never auto-clears after a click. Your handler must reset the bound boolean flag itself, typically in a finally block after the awaited work completes.

Should I use Content or ChildContent for SfButton text?▼

Use the Content property for button text. ChildContent is marked as an internal API with EditorBrowsableState.Never, meaning it is unsupported and could break in future releases. Combine Content with IconCss for icon-plus-text buttons.