CODEWITHSUNDEEP
asp.netasp.net-mvc-4
Ben Rubin
Ben Rubin

Reputation: 7341

Required validation failing even though text box has data

I have a search page which has a MyViewModel class as its model. I'm having a problem where a field is highlighting red, because of missing data from a [Required] attribute, even though the field does have a value.

Here's the view model

public class MyViewModel
{
   [DisplayName("My Field")]
   [Required]
   public string MyField { get; set; }

   // This gets populated with search results from the database
   // whenever the user clicks the Search button and the page
   // posts back
   public List<Customer> SearchResults { get; set; }
}

Here's the ASP page

@model MyProgram.MyViewModel

@using (Html.BeginForm("ListMyData", "Test", FormMethod.Get, htmlAttributes: new { @id = "search-form", @class = "form-horizontal" }))
{
   <div class="form-group">
      @Html.LabelFor(model => model.MyField, new { @class = "control-label col-sm-2" })
      <div class="col-sm-2">
         @Html.TextBoxFor(model => model.MyField, htmlAttributes: new { @class = "form-control" })
      </div>
   </div>
}

Here's my controller

public class TestController
{
   // The first time that the user navigates to this page, the "else" clause
   // will execute and the form will get populated with default values.  When
   // the user clicks the "search" button, the view model will get populated
   // with database search results
   public ActionResult ListMyData(MyViewModel viewModel)
   {
      if (!string.IsNullOrEmpty(viewModel.MyField))
      {
         // Search database and return results
         /* viewModel.SearchResults = [data from database] */
      }
      else
      { 
         viewModel.MyField = "something";
      }

      return View("ListMyData", viewModel);
   }
}

The value "something" is displayed in my text box on the page, but the text box is highlighted red. It's definitely the [Required] attribute that's doing it, because the red goes away if I remove the [Required] attribute.

Why is the validation failing even though the text box has data in it?

EDIT: Here's my layout page showing my scripts.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>@ViewBag.Title - My ASP.NET Application</title>
    @Styles.Render("~/Content/css")
    @Styles.Render("~/Content/DataTables/css/jquery.dataTables.css")
    @Scripts.Render("~/bundles/modernizr")
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
   @RenderBody()

   @Scripts.Render("~/bundles/jquery")
   @Scripts.Render("~/bundles/bootstrap")
   @Scripts.Render("~/Scripts/jquery.unobtrusive-ajax.min.js")
   @Scripts.Render("~/Scripts/DataTables/jquery.dataTables.min.js")
   @RenderSection("scripts", required: false)
</body>
</html>

Upvotes: 0

Views: 46

Answers (1)

hardkoded
hardkoded

Reputation: 21627

The problem is that you are getting validations from the ModelState from the viewModel you are receiving as an argument (which by default has no value).

One thing to solve this is by clearing the Model state before returning it.

ModelState.Clear();
return View("ListMyData", viewModel);

Upvotes: 1

Related Questions