Kendo UI Detailstemplate in Grid Fails Validation

Question

I am using Kendo UI in my ASP.NET MVC 4.0 application.

I have a grid with detailed templates in my details template i have a form

  @(Html.Kendo().TabStrip()
            .Name("TabStrip_#=UserID#")
            .SelectedIndex(0)
            .Events(e => e.ContentLoad("UserDetailsEditable"))
            .Items(tab =>
            {
                tab.Add().Text("User Details")
                    .LoadContentFrom("UserDetails", "User", new { UserID = "#= UserID #"});
            })
            .ToClientTemplate()

)

This form is not firing validation derived from Model Data annotation.

That because it is not recognizing my validation scripts

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

if I move this reference @Scripts.Render("~/bundles/jqueryval") from layout.cshtml to Form view validations will work but my form post will be done multiple times. because my script reference will be loaded multiple time for each details template.

How can i over come this problem?

Solution:

I have split jQuery Val bundle

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

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

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

in my layout i gave only @Scripts.Render("~/bundles/unobtrusive")

in all my form views i gave @Scripts.Render("~/bundles/jqueryval")

that solved the problem. Hope this can help others

Answer 1

I have split jQuery Val bundle

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

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

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

in my layout i gave only @Scripts.Render("~/bundles/unobtrusive")

in all my form views i gave @Scripts.Render("~/bundles/jqueryval")

that solved the problem. Hope this can help others