.NET 8 Blazor - Cannot submit the form because no form on the page currently has that name.

[Shaun Walker]

Is there an existing issue for this?

• I have searched the existing issues

Describe the bug

When creating a static component which has a form element that is rendered based on conditional logic, the form will be displayed:

However when a user clicks a button to submit the form it will display a message at the top of the browser window "Cannot submit the form because no form on the page currently has that name." .

No exception is raised... it is simply a hard crash of the web UI. Refreshing the page in the browser will restore the UI (because it resets the state).

Expected Behavior

The form onsubmit handler should execute as expected, without throwing an error.

Steps To Reproduce

The following is a minimal repro:

@page "/"

<PageTitle>Form Error</PageTitle>

@if (string.IsNullOrEmpty(_message))
{
    <form method="post" @formname="Form1" @onsubmit="DisplayMessage" data-enhance>
        <AntiforgeryToken />
        <button type="submit" class="btn btn-primary">Submit Form1</button>
    </form>
}
else
{
    <div class="alert alert-info" role="alert">
        @_message
        <form method="post" @formname="Form2" @onsubmit="DismissMessage" data-enhance>
            <AntiforgeryToken />
            <button type="submit" class="btn btn-primary">Submit Form2</button>
        </form>
    </div>
}

@code {
    string _message = "";

    private void DisplayMessage()
    {
        _message = "Now Click The Button To Dismiss The Message";
    }

    private void DismissMessage()
    {
        _message = "";
    }
}

Exceptions (if any)

No exceptions are thrown - a message is displayed in the browser

.NET Version

8.0.4

Anything else?

Note that this does not appear to be an Enhanced Navigation issue, as it even occurs when the data-enhance attribute is removed from the form element.