Post form with a page handler after changing the value in Select input

Question

I am rather new to .NET 6/Razor pages. I want to mimic the behavior of the web forms when the drop down list value was changed. In web form, I could do OnSelectedIndexChanged and it would hit a specific method in the code behind. What is the best way to do this with a razor page?

Currently, I have

<button class="btn btn-info text-white" asp-page-handler="ResetForm"><i class="fa-solid fa-ban"></i> Clear</button>    
<select asp-for="CurrentPage" onchange="ddlCurrentPageChange()" asp-items="Model.DdlPages" ></select>
    <script>
        function ddlCurrentPageChange() {
            document.getElementById("form");
        }
    </script>

The issue is if I click the reset button and then change the DDL value, it posts to the handler ResetForm

Answer 1

You could always make your onchange the submit action, which will POST:

<form method="post" id="test">
        <select asp-for=CurrentPage onchange="document.forms['test'].submit();" [email protected] ></select>
</form>

page.cshtml.cs

public void OnPost(string currentPage)
{
    MoveTo(currentPage);
}

public void MoveTo(string page)
{
    Console.WriteLine(page);
}

EDIT: Fixed incorrect data as pointed out by @jeremycaney