How to invoke js in blazor anywhere?

Question

I'm try to call js on a button onclick event in blazor (server), but I got the error:

JavaScript interop calls cannot be issued at this time. This is because the component is being statically rendererd. When prerendering is enabled, JavaScript interop calls can only be performed during the OnAfterRenderAsync lifecycle method.

And I'm using Server render mode.

<component type="typeof(App)" render-mode="Server" />

If I use client render mode, it works correctly.

Stoway · Accepted Answer · 2020-06-08 06:17:26Z

1

While a Blazor Server app is prerendering, certain actions, such as calling into JavaScript, aren't possible because a connection with the browser hasn't been established. Components may need to render differently when prerendered. For more information, see the Detect when the app is prerendering section.

reference:https://learn.microsoft.com/en-us/aspnet/core/blazor/lifecycle?view=aspnetcore-3.1

answered Jun 8, 2020 at 6:17

Stoway

112 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

xy z Over a year ago

So that has nothing to do with the "render-mode" value?

Andrea Spada · Accepted Answer · 2021-06-01 05:40:03Z

I'm using the server version and in the follow example I have the same errore exposed above.

File .razor:
      <RadzenTabs SelectedIndex="0" Change=@(args => OnChangeRadzenTab(args))>

File.cs:
        async void OnChangeRadzenTab(int value)
        {
            switch (value)
            {
               case 0:
                   await jsRuntime.InvokeVoidAsync("eval", $@"document.getElementById(""NameOfField"").focus()");
                   break;

But in the follow one, instead, the code run. Why there are these differences of behavour?

File .razor:
        <RadzenMask Mask="**/**/****" Pattern="[^0-9]" Name="EndDate" Id="EndDate"
                    @bind-Value=@EndDate  @onfocusout=@(args => OnFocusOutEndDate(args)) /> 

File.cs:
        async void OnFocusOutEndDate(FocusEventArgs? value)
        {
            if (!LibB.CheckDate(EndDate))
            {
                await jsRuntime.InvokeVoidAsync("eval", $@"document.getElementById(""EndDate"").focus()");
                Error = true;
            }
        }

Collectives™ on Stack Overflow

How to invoke js in blazor anywhere?

2 Answers 2

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Related