Skip to main content
All docs
V24.2

DxRadioGroup<TData, TValue>.ItemTemplate Property

Specifies a template used to display the item labels.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public RenderFragment<TData> ItemTemplate { get; set; }

Property Value

Type Description
RenderFragment<TData>

The template content.

Remarks

<label id="group-label">Select your drink:</label>
<DxRadioGroup Items="@Drinks"
              @bind-Value="@SelectedDrinkId"
              ValueFieldName="@nameof(Product.ProductId)"
              EnabledFieldName="@nameof(Product.InStock)"
              aria-labelledby="group-label">
    <ItemTemplate>@context.ProductName @GetDrinkState(context)</ItemTemplate>
</DxRadioGroup>
<p>
    You have selected:
    <strong>@GetDrinkName()</strong>
</p>

@code {
    int SelectedDrinkId { get; set; } = 2;
    IEnumerable<Product> Products { get; set; }
    IEnumerable<Product> drinks;

    IEnumerable<Product> Drinks {
        get => drinks;
        set {
            drinks = value;
            InvokeAsync(StateHasChanged);
        }
    }

    protected override async Task OnInitializedAsync() {
        Products = await NwindDataService.GetProductsAsync();
        Drinks = Products.Where(p => p.CategoryId == 1).Take(5).AsEnumerable();
    }

    string GetDrinkState(Product product) => product.InStock ? $"({product.UnitsInStock} units left)" : "(out of stock)";

    string GetDrinkName() => Drinks.First(p => p.ProductId == SelectedDrinkId).ProductName;
}

RadioGroup - Item Template

Run Demo: RadioGroup - Item Template

See Also