validate html input in asp.net with MVC

Question

I am a beginner in MVC. I am trying to create a registration form.

This is my view

 <div class="registrationForm">
          @using (Html.BeginForm("Registration", "Login", FormMethod.Post, new { enctype = "multipart/form-data" }))
          {
              <p>
                  <input type="text" id="firstname" name="firstName" placeholder="First Name" class="radius mini" />
                  <input type="text" id="lastname" name="lastName" placeholder="Last Name" class="radius mini" />
              </p>
              <p>
                  <input type="text" id="email" name="email" placeholder="Your Email" class="radius" />
              </p>
              <p>
                  <input type="text" id="remail" name="remail" placeholder="Re-enter Email" class="radius" />
              </p>
              <p>
                  <input type="password" id="password" name="password" placeholder="New Password" class="radius" />
              </p>
              <p>
                  <button class="radius title" name="signup" type="submit">Sign Up</button>
              </p>
        }
      </div>

I would like to validate all the input fields in the view. Could you please help me? Thanks in advance.

use jquery-validator.js plugin which comes by default when you create an MVC project — Guruprasad J Rao
– Guruprasad J Rao, Commented Sep 16, 2015 at 6:17

marc_s · Accepted Answer · 2016-05-26 20:49:46Z

1

There are two different way to validate one by using MVC framewrok provided Helper methods that allow to make validation on client side and second by using just jQuery validation on client side but the first one is best to validate that will perform validation on both side server side and client side.

By using Helper Method

in the view

 <div class="registrationForm">
      @using (Html.BeginForm("Registration", "Login", FormMethod.Post, new { enctype = "multipart/form-data" }))
      {
          <p>
             @Html.TextBoxFor(m => m.firstName, new { @class = "form-control" })
             @Html.ValidationMessageFor(m => m.firstName)

             @Html.TextBoxFor(m => m.lastname, new { @class = "form-control" })
             @Html.ValidationMessageFor(m => m.lastname)
          </p>
          <p>

             @Html.TextBoxFor(m => m.email, new { @class = "form-control" })
             @Html.ValidationMessageFor(m => m.email)             
          </p>
          <p>

             @Html.TextBoxFor(m => m.remail, new { @class = "form-control" })
             @Html.ValidationMessageFor(m => m.remail)  

          </p>
          <p>

             @Html.TextBoxFor(m => m.password, new { @class = "form-control" })
             @Html.ValidationMessageFor(m => m.password)  

          </p>
          <p>
          <input class="radius title" name="signup" type="submit" value="Sign Up">
          </p>
    }
  </div> 

 <script src="~/Scripts/jquery.validate.min.js"></script>

**Note : ** dont forget to include jquery.validate.min.js

ModelView Class

public class RegisterViewModel
{
    [Required]
    [Display(Name = "Enter first name")]
    public string firstname{ get; set; }

    [Required]
    [Display(Name = "Enter lastname")]
    public string lastname{ get; set; }

    [Required]
    [Display(Name = "Enter Email")]
    public string email{ get; set; }

    [Required]
    [Display(Name = "Reenter email")]
    public string remail{ get; set; }

    [Required]
    [StringLength(100, ErrorMessage = "The {0} must be at least {2} characters long.", MinimumLength = 6)]
    [DataType(DataType.Password)]
    [Display(Name = "Password")]
    public string password { get; set; }

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

Controller->Action

    public ActionResult Registration(RegisterViewModel model)
    {
        if (ModelState.IsValid)
        {
          /// you logic
        }
    }

edited May 26, 2016 at 20:49

marc_s

760k186 gold badges1.4k silver badges1.5k bronze badges

answered Sep 16, 2015 at 7:33

Muhammad Usman

1,3625 gold badges19 silver badges35 bronze badges

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

3 Comments

Libin C Jacob Over a year ago

Thanks for your answer. Actually my need is to replace all this razor syntax with the traditional html as shown in my question. Is there any method to make any validation to the html input.

J Santosh Over a year ago

@LibinCJacob, replace all this razor syntax with the traditional html as shown in my question why do you want to do so?

Muhammad Usman Over a year ago

@LibinCJacob I visit this link for that jqueryvalidation.org/required-method

Collectives™ on Stack Overflow

validate html input in asp.net with MVC

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related