<script src="~/Scripts/jquery.validate.min.js" type="text/javascript"></script> <script src="~/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
عدم سازگاری پیش فرض jquery.validate با بعضی از ویجتهای Kendo UI
در حالت استفاده از Kendo UI، این سیستم هنوز هم کار میکند؛ اما با یک مشکل. اگر برای مثال از kendoComboBox استفاده کنید، اعتبارسنجیهای تعریف شده در برنامه، توسط jquery.validate دیده نخواهند شد. برای مثال فرض کنید یک چنین مدلی در اختیار View برنامه قرار گرفته است:
public class OrderDetailViewModel { [StringLength(15)] [Required] public string Destination { get; set; } }
@model Mvc4TestViewModel.Models.OrderDetailViewModel @using (Ajax.BeginForm(actionName: "Index", controllerName: "Home", ajaxOptions:new AjaxOptions(), htmlAttributes: new { id = "Form1", name ="Form1" }, routeValues: new { } )) { @Html.AntiForgeryToken() @Html.ValidationSummary(true) <fieldset> <legend>OrderDetail</legend> <div class="editor-label"> @Html.LabelFor(model => model.Destination) </div> <div class="editor-field"> @Html.TextBoxFor(model => model.Destination, new { @class = "k-textbox" }) @Html.ValidationMessageFor(model => model.Destination) </div> <p> <button class="k-button" type="submit" title="Sumbit"> Sumbit </button> </p> </fieldset> } @section JavaScript { <script type="text/javascript"> $(function () { $("#Destination").kendoComboBox({ dataSource: [ "loc 1", "loc 2" ] }); </script> }
همانطور که در تصویر مشاهده میکنید، با اتصال kendoComboBox به یک فیلد، این فیلد در حالت مخفی قرار میگیرد و ویجت کندو یو آی بجای آن نمایش داده خواهد شد. در این حالت چون در فایل jquery.validate.js چنین تنظیمی وجود دارد:
$.extend( $.validator, { defaults: { //… ignore: ":hidden",
راه حل آن نیز سادهاست. تنها باید خاصیت ignore را بازنویسی کرد و تغییر داد:
<script type="text/javascript"> $(function () { var form = $('#Form1'); form.data('validator').settings.ignore = ''; // default is ":hidden". }); </script>
<script type="text/javascript"> $.validator.setDefaults({ ignore: "" }); </script>
یکپارچه کردن سیستم اعتبارسنجی Kendo UI با سیستم اعتبارسنجی ASP.NET MVC
در مطلب «اعتبار سنجی ورودیهای کاربر در Kendo UI» با زیرساخت اعتبارسنجی Kendo UI آشنا شدید. برای اینکه بتوان این سیستم را با ASP.NET MVC یکپارچه کرد، نیاز است دو کار صورت گیرد:
الف) تعریف فایل kendo.aspnetmvc.js به صفحه اضافه شود:
<script src="~/Scripts/kendo.aspnetmvc.js" type="text/javascript"></script>
<script type="text/javascript"> $(function () { $("form").kendoValidator(); }); </script>
فایل kendo.aspnetmvc.js که در بستهی مخصوص Kendo UI تهیه شده برای ASP.NET MVC موجود است (در پوشهی js آن)، عملکردی مشابه فایل jquery.validate.unobtrusive مایکروسافت دارد. کار آن وفق دادن و ترجمهی اعتبارسنجی unobtrusive به روش Kendo UI است.
این فایل را از اینجا میتوانید دریافت کنید:
kendo.mvc.zip
البته باید دقت داشت که در حال حاضر فقط ویژگیهای ذیل از ASP.NET MVC توسط kendo.aspnetmvc.js پشتیبانی میشوند:
Required StringLength Range RegularExpression