Edit Model for Forms in ASP.NET Core 3

Question

I am having an issue retrieving the data from my form in the controller (I am receiving Null for all the parameter).

Controller Action:

public async Task<IActionResult> Register(RegisterFormModel registerFormModel)
        {
            if (ModelState.IsValid)
            {
                ....
            }
        }

my Edit Model:

public class RegisterFormModel
    {
        [Required]
        [StringLength(100)]
        [DisplayName("First Name")]
        public string RegisterFirstName { get; set; } 

        [Required]
        [EmailAddress]
        [DisplayName("Email")]
        public string RegisterEmail { get; set; }

        [Required]
        [StringLength(100)]
        [DataType(DataType.Password)]
        [DisplayName("Password")]
        public string RegisterPass { get; set; }

        [DataType(DataType.Password)]
        [Compare("RegisterPass", ErrorMessage = "The password and confirmation password do not match.")]
        [DisplayName("Confirm Password")]
        public string ConfirmRegisterPass { get; set; }


    }

and my view include:

@model ProjectName.Model.RegisterFormModel
....

....
<div class="wrap-login100 p-l-50 p-r-50 p-t-72 p-b-50">
                <form class="login100-form validate-form" method="post" asp-controller="Account" asp-action="Register">
                    <span class="login100-form-title p-b-59">
                        Sign Up
                    </span>

                    <div class="wrap-input100 validate-input" data-validate="Name is required">
                        <span class="label-input100">Full Name</span>
                        <input asp-for="@Model.RegisterFirstName" class="input100" type="text" name="name" placeholder="Name...">
                        <span asp-validation-for="@Model.RegisterFirstName" class="focus-input100"></span>
                    </div>

                    <div class="wrap-input100 validate-input" data-validate="Valid email is required: ex@abc.xyz">
                        <span class="label-input100">Email</span>
                        <input asp-for="RegisterEmail" class="input100" type="text" name="email" placeholder="Email addess..">
                        <span asp-validation-for="RegisterEmail" class="focus-input100"></span>
                    </div>



                    <div class="wrap-input100 validate-input" data-validate="Password is required">
                        <span class="label-input100">Password</span>
                        <input asp-for="RegisterPass" class="input100" type="text" name="pass" placeholder="************">
                        <span asp-validation-for="RegisterPass" class="focus-input100"></span>
                    </div>

                    <div class="wrap-input100 validate-input" data-validate="Repeat Password is required">
                        <span class="label-input100">Repeat Password</span>
                        <input asp-for="ConfirmRegisterPass" class="input100" type="text" name="repeat-pass" placeholder="*************">
                        <span asp-validation-for="ConfirmRegisterPass" class="focus-input100"></span>
                    </div>

                    <div class="container-login100-form-btn">
                        <div class="wrap-login100-form-btn">
                            <div class="login100-form-bgbtn"></div>
                            <button type="submit" class="login100-form-btn">
                                Sign Up
                            </button>
                        </div>                      
                    </div>
                </form>
            </div>

Now all my variables in the registerFormModel object in the controller are recieved NULLs once i hit Sign UP.

Any Idea what i am doing Wrong ?

Thanks

Answer 1

Specifying the name attributes on your input controls is breaking the aspnet model binding. When using asp-for to bind to a model property the "name" and "id" attributes will be automatically generated.

This is incorrect:

<input asp-for="RegisterEmail" class="input100" 
    type="text" name="email" placeholder="Email addess..">

Remove name attribute to allow normal model binding

<input asp-for="RegisterEmail" class="input100" 
    type="text" placeholder="Email addess..">

Answer 2

It was the name tag; asp-for should be instead of the name and id tags.