title: mvc3 - ajax form submit and server side validation
body: <p>I am sure this has been asked already, but I have been trying all the solutions given, but none of the given solution is solving my problem. Probably, I am not implementing it right.</p>
  <p>I am using MVC3, razor, jQuery.</p>
  <p>I have a new user registration form. Once registration is successful, I want to display the successful message (different on type of registration) in a dialog box.</p>
  <p>If there is any error with ModelState, means ModelState.IsValid == false, I want to display errors in ValidationSummary.</p>
  <p>View
  </p>
  <pre><code>function OnBegin () { alert('begin'); return $('form').validate().form(); }
  function OnSuccess () { alert('success'); DisplaySucess()}
  function OnFailure () { alert('failure'); }
  function DisplaySuccess() {
      var typeOfRegistration = $('input:radio[name=RegistrationType]:checked').val();
      var msg;
      if (typeOfRegistration == 0) {
          msg = &quot;You are successfully enrolled for Algebra classes.&quot;;
      }
      if (typeOfRegistration == 1) {
          msg = &quot;You are registered with your email address. Someone would contact you with an email.&quot;;
      }
      if (typeOfRegistration == 2) {
          msg = &quot;Thank you for filling up this form. One welcome packet would be delivered with in next 15 days&quot;;
      }
  
      msg = msg.replace(/\n/g, '&lt;br /&gt;');
      $('#dialog').html(msg);
      $('#dialog').dialog('open');
  }
  </code></pre>
  
  <pre><code>@model Models.RegistrationModel
  @using (Ajax.BeginForm(&quot;NewRegistration&quot;, &quot;Account&quot;, new AjaxOptions() { OnBegin=&quot;OnBegin&quot;, OnSuccess = &quot;OnSuccess&quot;, OnFailure = &quot;OnFailure&quot; }))
  { 
    @Html.ValidationSummary()
      &lt;div&gt;
      Register&lt;br /&gt;
      @Html.RadioButton(&quot;RegistrationType &quot;, &quot;0&quot;, true) New Algebra class&lt;br /&gt;
      @Html.RadioButton(&quot;RegistrationType &quot;, &quot;1&quot;) New user registration by email&lt;br /&gt;
      @Html.RadioButton(&quot;RegistrationType &quot;, &quot;2&quot;) New user registration by mailing address&lt;br/&gt;
     ..some more types
  &lt;/div&gt;
  &lt;div&gt;
      …here I display/hide controls based on Registration type selected.
          &lt;div&gt;
      @Html.LabelFor(&quot;UserName&quot;)
      @Html.TextBox(&quot;UserName&quot;)&lt;/div&gt;
  }
  </code></pre>
  <p>Controller</p>
  <pre><code>public ActionResult NewRegistration(RegistrationModel model)
  {
  
           if (Request.IsAjaxRequest())
           {
               if (!ModelState.IsValid) { 
          //Ques: How do I display this in ValidationSummary. 
          return Json(new object[] { false, &quot;Contains Email Address&quot;, ModelState.GetAllErrors() }); 
          }
               else { 
          if (UserNameIsTaken){ 
              //Ques: This does not show in ValidationSummary
              ModelState.AddModelError(&quot;_FORM&quot;, &quot;This username is already taken. Please pick a different username.&quot;);
          }
         }
      }
           else if (!ModelState.IsValid) { return View(model); }
  
  }
  </code></pre>
  <p>Model</p>
  <pre><code>public class RegistrationModel: IValidatableObject
  {
  [Required] //this gets displayed in ValidationSummary as Client-side validation
      public string UserName { get; set; }
      .. and all fields here
  }
  public IEnumerable&lt;ValidationResult&gt; Validate(ValidationContext context)
  {
          if (!string.IsNullOrEmpty(UserName) &amp;&amp; UserName.Contains(EmailAddress)) {
              yield return new ValidationResult(&quot;Username cannot contain email address&quot;, new[] { &quot;UserName&quot; });
          }
      }
  </code></pre>
  <p>Web.config has</p>
  <blockquote>
  <p>UnobtrusiveJavaScriptEnabled=&quot;true&quot; and ClientValidationEnabled=&quot;true&quot;</p>
  </blockquote>
  <p>.js files included are</p>
  <blockquote>
  <p>script src=&quot;@Url.Content(&quot;~/Scripts/jquery-1.7.1.min.js&quot;)&quot; type=&quot;text/javascript&quot;&gt;</p>
  <p>script src=&quot;@Url.Content(&quot;~/Scripts/jquery.validate.min.js&quot;)&quot; type=&quot;text/javascript&quot;&gt;</p>
  <p>script src=&quot;@Url.Content(&quot;~/Scripts/jquery.validate.unobtrusive.min.js&quot;)&quot; type=&quot;text/javascript&quot;&gt;</p>
  <p>script src=&quot;@Url.Content(&quot;~/Scripts/jquery.unobtrusive-ajax.min.js&quot;)&quot; type=&quot;text/javascript&quot;&gt;</p>
  </blockquote>
  <p>What am I missing here? Any alternative?
  Thanks in advance.</p>