title: MVC disabling client side validation on a model field
body: <p>I have a model for creating/editing items and the items can belong to a category.</p>
  
  <p>The category renders as a drop down so the user can choose a category, or fill in a new category via a textbox.</p>
  
  <p>The issue I am having is the dropdown seems to want to force the user to select a value from the drop down. The expected use is for that field to be  optional.</p>
  
  <p>Here are the relevant model properties:</p>
  
  <pre><code>[Display(Name = "Category")]
  public int CategoryId { get; set; }
  public System.Web.Mvc.SelectList Categories { get; set; }
  </code></pre>
  
  <p>And in my view:</p>
  
  <pre><code>&lt;div class="form-group"&gt;
      @Html.LabelFor(m =&gt; m.CategoryId, new { @class = "control-label" })
      @Html.DropDownList("CategoryId", Model.Categories, "Select a category", new { @class = "form-control" })
  &lt;/div&gt;
  &lt;input type="submit" value="Create" class="btn btn-primary" title="Create new item" /&gt;
  </code></pre>
  
  <p>And how I set the properties in controller:</p>
  
  <pre><code>// categories is a List of POCO class with CategoryId and CategoryName fields.
  Categories = new SelectList(categories, "CategoryId", "CategoryName")
  </code></pre>
  
  <p>When I browse to the page and click Create, the category drop down is focused on, meaning the JS deems it missing, but no error message is displayed as I do not have the ValidationMessageFor() helper set.</p>
  
  <p>The rendered classes for the  are</p>
  
  <pre><code>form-control input-validation-error
  </code></pre>
  
  <p>So how do I make this field optional?</p>
  
  <p>Edit: The data-* attributes after rendering on the select are</p>
  
  <pre><code>data-val-number="The field Category must be a number." data-val-required="The Category field is required."
  </code></pre>