0

I'm working on a MVC webapplication (upgraded from MVC4 to MVC5) and I can't get the clientside validation working. So in order to rule things out i've created a default empty MVC application.

Unfortunately I still can't get things working, the contactform keeps submitting to the server and afterworths showing an error message from the server because the viewmodel is invalid.

This is my code;

Contact.cshtml

@model BLL.DTO.ContactDTO
@{
    ViewBag.Title = "Contact";
}
<h2>@ViewBag.Title.</h2>
<h3>@ViewBag.Message</h3>

@using (Html.BeginForm("Contact","Home", FormMethod.Post, new {id = "contactform"}))
{
    @Html.LabelFor(x => x.Firstname)
    @Html.TextBoxFor(x => x.Firstname)
    @Html.ValidationMessageFor(x => x.Firstname)

    <input type="submit" value="Verzenden"/>
}

<address>
    One Microsoft Way<br />
    Redmond, WA 98052-6399<br />
    <abbr title="Phone">P:</abbr>
    425.555.0100
</address>

<address>
    <strong>Support:</strong> <a href="mailto:Support@example.com">Support@example.com</a><br/>
    <strong>Marketing:</strong> <a href="mailto:Marketing@example.com">Marketing@example.com</a>
</address>

@*@section scripts {
    <script type="text/javascript">
        $("#contactform").validate({
            debug: false
        });
    </script>    
}*@

ContactDTO.cs

public class ContactDTO : BaseDTO
{
    [Required (ErrorMessage = ErrorConstants.ThisFieldIsRequired)]
    [Display(Name = "Voornaam")]
    [MaxLength(75)]
    public string Firstname { get; set; }

    [Required(ErrorMessage = ErrorConstants.ThisFieldIsRequired)]
    [Display(Name = "Achternaam")]
    [MaxLength(75)]
    public string Lastname { get; set; }

    [Display(Name = "E-mail")]
    [DataType(DataType.EmailAddress)]
    public string Email { get; set; }

    [Display(Name = "Website")]
    public string Website { get; set; }

    [Required(ErrorMessage = ErrorConstants.ThisFieldIsRequired)]
    [Display(Name = "Opmerkingen")]
    [DataType(DataType.Text)]
    public string Comments { get; set; }
}

BundleConfig.cs

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/Scripts/jquery.validate*"));

bundles.Add(new ScriptBundle("~/bundles/msval").Include(
        "~/Scripts/jquery.validate.unobtrusive.js"));

web.config

<appSettings>
    <add key="webpages:Version" value="3.0.0.0"/>
    <add key="webpages:Enabled" value="false"/>
    <add key="ClientValidationEnabled" value="true"/>
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/>
  </appSettings>

_Layout.cshtml

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @*@Scripts.Render("~/bundles/jqueryval")*@
    @Scripts.Render("~/bundles/msval")

    @RenderSection("scripts", required: false)
</body>

As you probably can see in the code fragments I've also tried jquery.validate.js, but this doesn't work either.. I prefer to use the default unobtrusive validation, but unfortunately it keeps submitting the form to the server. I've also read several other topics (this, and this) and while the issues look similar, it doesn't solve my problem. What could this be..?

Community
  • 1
  • 1
Rob
  • 6,731
  • 12
  • 52
  • 90
  • 2
    You need both validate and validate-unobtrusive. Which will happen if you only include `~/bundles/jqueryval` because its mask matches `query.validate.unobtrusive` too. If you include both bundles, then with their current masks you will include `unobtrusive` twice. – GSerg Sep 09 '15 at 09:08
  • Where is your controller ? – John Louie Dela Cruz Sep 09 '15 at 09:10
  • You also need to show us your controller for us to know if you handled if the model passed to the view is valid or not. – John Louie Dela Cruz Sep 09 '15 at 09:13
  • 2
    Un-comment `@Scripts.Render("~/bundles/jqueryval")` so its included and comment out `@Scripts.Render("~/bundles/msval")` –  Sep 09 '15 at 09:16
  • @GSerg, thnx that was it.. Now seems to be working in my test application.. Will make the same changes to the normal application – Rob Sep 09 '15 at 09:17
  • @Heyyou, that was because I wasn't aware that both files where needed and I only wanted to use the unobtrusive validation – Rob Sep 09 '15 at 09:37
  • @GSerg, solved that was it indeed:) – Rob Sep 10 '15 at 12:31

1 Answers1

0

In my case the validation was not working due to my class library namespace and default models namespace was not matching hence the validation not working. I have corrected it and now its working fine.

Vikas Sonichya
  • 125
  • 1
  • 6