Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

Blazor button onclick is not triggering using InteractiveServer rendermode

$
0
0

I have a server assembly page where I just can't get it to invoke the code-behind (the Home page, Contacts component).

In the browser console, there are no errors.

In the Contacts component, at the top of the page I added:

@rendermode InteractiveServer

I then have a button:

<button type="button" @onclick="@SendEmail" class="form contact-form-button light-form oswald light uppercase">send email</button>

... and the function in the @code section:

    private async Task SendEmail()    {        await Task.Delay(1);        if (IsValidMail())        {            SendMessage = Utils.SendMail(contact.Name, contact.Email, contact.Subject, contact.Body);        }        else        {            SendMessage = "Please fill out all the fields and try again.";        }    }

Now here's the weird thing - if I put the button inside of a form and make it a submit button, it calls SendEMail(). I don't want to do it this way because it refreshes the home page and loses other things like the message I want to return if the IsValidMail() fails.

If I remove the form, or remove the onsubmit for the form to call SendEMail(), then the button will not invoke the method, even though I specified rendermode.

I also tried in the App.razor where it has <Routes /> to add a specification like this:

<Routes rendermode="RenderMode.InteractiveServer" />

...which should force interactive server mode for all pages, but it won't get the button to invoke the method.

I should add, I also verified in Program.cs that the template generated the code:

builder.Services.AddRazorComponents()    .AddInteractiveServerComponents();

... and

app.MapRazorComponents<App>()    .AddInteractiveServerRenderMode();

Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>