Why when you click on input, nothing happens in the form?

I’m making a small page where you can create users, change their password and delete them. The creation works well, but deleting and changing the password does not respond to clicking in any way. It works correctly through the postman. What could be the problem?

@page
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
    Layout = "Shared/_MonitoringLayout";
    ViewData["PageTitle"] = "users";
}

@section MainBlock {
    @{
        if (@Model.Error != null)
        {
            <div>
                <span style="color: red">@($"Error: {Model.Error}")</span>
            </div>
        }
        else
        {
            <div>
                <table style="max-width: 70%" class="m_table">
                    <thead class="m_table_header">
                        <tr>
                            <th style="width: 5%">
                                Id
                            </th>
                            <th style="width: 15%">
                                Name
                            </th>
                            <th style="width: 15%">
                                Login
                            </th style="width: 25%">
                             <th>
                                Action
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var rootUser in Model.RootUsers)
                        {
                            <tr>
                                <td>
                                    @rootUser.Id
                                </td>
                                <td>
                                    @rootUser.DisplayName
                                </td>
                                <td>
                                    @rootUser.Login
                                </td>
                                <td>
                                    <from method="post">
                                        <div>
                                            <lable>NewPassword:</lable>
                                            <input type="password" name="password" required />
                                            <input asp-page-handler="ChangePassword" value="Change" type="submit"/>
                                        </div>
                                    </from>
                                    <from method="post">
                                        <input asp-page-handler="DeleteUser" asp-route-id="@rootUser.Id" value="Delete" type="submit"/>
                                    </from>
                                </td>
                            </tr>
                        }
                    </tbody>
                </table>
            </div>
            <br />
        }

        <div>
            <form method="post">
                <h1>Create</h1>
                <div class="input-container">
                    <input asp-for="CreateAccountRequest.DisplayName" type="text" required />
                    <lable asp-for="CreateAccountRequest.DisplayName">Name</lable>
                </div>
                <div class="input-container">
                    <input asp-for="CreateAccountRequest.Login" type="text" value="root" readonly/>
                    <lable asp-for="CreateAccountRequest.Login">Login</lable>
                </div>
               <div>
                    <input asp-for="CreateAccountRequest.Password" type="password" required/>
                    <lable asp-for="CreateAccountRequest.Password">Password</lable>
                </div>
                <button asp-page-handler="create" type="submit">Create</button>
            </form>
        </div>
    }
};
    [IgnoreAntiforgeryToken]
    public class ServiceUsersModel : PageModel
    {
        public List<InternalAccountResponse> RootUsers { get; private set; }

        [BindProperty]
        public InternalCreateAccountV2Request CreateAccountRequest { get; set; }

        protected async override Task<IActionResult> OnGet()
        {
            ..Do
        }

        public async Task<IActionResult> OnPostCreateAsync()
        {
            ..Do
        }

        public async Task<IActionResult> OnPostDeleteUserAsync(long id)
        {
            ..Do
        }

        public async Task<IActionResult> OnPostChangePasswordAsync(string password)
        {
            ..Do
        }
    }

I tried tracking requests through the developer tools in chrome and through debugging, requests just don’t go away, although formaction="/monitoring/serviceusers?id=536&handler=deleteUser" is formed to delete and /monitoring/serviceusers?handler=ChangePassword" to change the password. If you send these requests through the postman, then they reach the service.

>Solution :

<form method="post">
   <div>
      <lable>NewPassword:</lable>
      <input type="password" name="password" required />
      <input asp-page-handler="ChangePassword" value="Change" type="submit"/>
   </div>
</form>

<form method="post">
     <input asp-page-handler="DeleteUser" asp-route-id="@rootUser.Id" value="Delete" type="submit"/>
</form>

<from> tag should be using the <form> tag

Leave a Reply