Button click not firing

Hello! I have a RadzenButton that should retrieve more data from the server but the click action is never trigged, with a "regular" button it fires with no problem.

Here is my code

-- View

@page "/Ingredients"
@using Chooser.Portal.BackendServices.DataModels.Ingredients.GetByRestaurant
@if (Ingredients != null)
    @foreach (var item in Ingredients)
        <br />

@if (Errors != null)
    @foreach (var error in Errors)
        <label style="color:red">@error</label>

<button @onclick="LoadMore">Load More</button>
<Radzen.Blazor.RadzenButton @onclick="@LoadMore"> LoadMore </Radzen.Blazor.RadzenButton>

-- CodeBehind

using Chooser.Portal.BackendServices.DataModels.Ingredients.GetByRestaurant;
using Chooser.Portal.BackendServices.RequestServices;
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace Chooser.Portal.Pages.Portal.IngredientArea.Index
    public partial class IndexView : ComponentBase
        public IIngredientsService _ingredientsService { get; set; }

        public List<GetByRestaurantResponseItem> Ingredients { get; set; }

        public List<string> Errors { get; set; }

        protected override async Task OnAfterRenderAsync(bool firstRender)
            if (firstRender && Ingredients == null)
                await Initiaze();
            await base.OnAfterRenderAsync(firstRender);

        internal async Task Initiaze()
            await LoadData();

        internal async Task LoadData()
            var result = await _ingredientsService.GetIngredients();
            if (result.Success)
                if (Ingredients == null)
                    Ingredients = result.Data.Ingredients;
                Errors = result.Messages;

        internal async Task LoadMore()
            await LoadData();


-- Imports

@using System.Net.Http
@using System.Net.Http.Json
@using Microsoft.AspNetCore.Components.Forms
@using Microsoft.AspNetCore.Components.Routing
@using Microsoft.AspNetCore.Components.Web
@using Microsoft.AspNetCore.Components.WebAssembly.Http
@using Microsoft.JSInterop
@using Chooser.Portal
@using Chooser.Portal.Shared
@using Radzen
@using Radzen.Blazor


<!DOCTYPE html>

    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <base href="/" />
    <link href="css/bootstrap/bootstrap.min.css" rel="stylesheet" />
    <link href="css/app.css" rel="stylesheet" />
    <link rel="stylesheet" href="_content/Radzen.Blazor/css/default.css">


    <div id="blazor-error-ui">
        An unhandled error has occurred.
        <a href="" class="reload">Reload</a>
        <a class="dismiss">🗙</a>
    <script src="_framework/blazor.webassembly.js"></script>
    <script src="_content/Radzen.Blazor/Radzen.Blazor.js"></script>


I have watched a lot of tutorials and I cannot find the problem =/

Thanks in advance

You need to use @Click instead of @onclick

1 Like

Thank you @korchev! Worked like a charm!