Comment activer ASP.Net MVC client de validation de Kendo UI DropDownList et ComboBox?
Lorsque j'utilise le Kendo UI ComboBox et de contrôles DropDownList dans mon MVC, Razor points de vue, la validation côté client ne se déclenche pas. Voici un exemple:
@using Kendo.Mvc.UI
@model KendoDropDownTest.Models.TestModel
@{
ViewBag.Title = "Kendo Drop Down and Combo Box Test";
}
<h2>Kendo Drop Down and Combo Box Test</h2>
@using (Html.BeginForm())
{
@Html.ValidationSummary()
<div>
@Html.LabelFor(x => x.DropDownValue)
@(Html.DropDownListFor(x => x.DropDownValue, Model.Options, "-- Select an Option --"))
@Html.ValidationMessageFor(x => x.DropDownValue)
</div>
<fieldset>
<legend>Kendo</legend>
<div>
@Html.LabelFor(x => x.KendoComboValue)
@(Html.Kendo().ComboBoxFor(x => x.KendoComboValue)
.BindTo(Model.Options.Select(x => x.Text)))
@Html.ValidationMessageFor(x => x.KendoComboValue)
</div>
<div>
@Html.LabelFor(x => x.KendoDropDownValue)
@(Html.Kendo().DropDownListFor(x => x.KendoDropDownValue)
.OptionLabel("-- Select an Option --")
.BindTo(Model.Options))
@Html.ValidationMessageFor(x => x.KendoDropDownValue)
</div>
</fieldset>
<input type="submit" value="Submit" />
}
Et le modèle correspondant:
public class TestModel
{
[Required]
public string DropDownValue { get; set; }
[Required]
public string KendoComboValue { get; set; }
[Required]
public string KendoDropDownValue { get; set; }
public SelectListItem[] Options = new[]
{
new SelectListItem
{
Text = "Option 1",
Value = "1"
},
new SelectListItem
{
Text = "Option 2",
Value = "2"
},
new SelectListItem
{
Text = "Option 3",
Value = "3"
},
};
}
La non-Kendo UI déroulant de manière appropriée montre l'erreur de validation lorsque le formulaire est envoyé, mais le Kendo contrôles ne sont pas. S'il vous plaît laissez-moi savoir si il existe un moyen pour permettre la validation côté client pour ces contrôles sans fil manuellement.
Un exemple complet de la solution est attaché à la suite de Kendo post sur le forum:
http://www.kendoui.com/forums/mvc/dropdownlist/mvc-client-validation-not-working.aspx
OriginalL'auteur Jason Smale | 2012-09-06
Vous devez vous connecter pour publier un commentaire.
Basé sur une réaction sur le Kendo forums, la raison, la validation ne fonctionne pas est parce que jquery valider n'est pas en mesure de valider les champs masqués par défaut. La façon la plus simple de changer c'est d'utiliser les $.valider.setDefaults méthode pour remplacer ce comportement comme:
N'est pas pour ajouter l'entrée à une erreur de validation" de la classe de la zone de liste modifiable ou une liste déroulante, mais au moins, il ajoute l'erreur de validation, et garde la forme de soumis.
ignore
un tableau vide.Trouvé un excellent ajout à ce. Si vous avez d'autres contrôles que vous souhaitez ne pas être validé si ce n'est caché, mais que vous voulez les contrôles spécifiques pour être caché, vous pouvez les ajouter à pas(ignorer) pour développer cette astuce utile: Par exemple, nous avons mis un .kendoDD tag sur le Kendo Déroulante, puis définissez: $.programme de validation.setDefaults({ ignorer: ":caché:non(.kendoDD)" }); stackoverflow.com/questions/20287567/...
OriginalL'auteur Jason Smale
Après avoir essayé beaucoup de choses, j'en suis venu à la conclusion que ASP.NET MVC validation avec jQuery discrète librairie js et le kendo de validation sont de deux types différents et incompatibles bêtes. Je câblé côté serveur et côté client code pour valider un kendo Multi-contrôle de sélection, mais rien de vraiment travaillé, y compris la setDefaults() la méthode sur le jQuery de validation d'$.validator).
J'ai enfin trouvé ce post http://www.macaalay.com/2014/02/15/enabling-asp-net-mvc-client-validation-for-kendo-ui-components/ et avait pour raccorder kendo validation séparément, avec la mise en garde qu'il ne s'intègre pas dans ASP.NET MVC récapitulatif de la validation du contrôle et, en général, ASP.NET MVC API de validation.
Voici l'extrait de code pour montrer ce qui devait être fait. Encore une fois, il pourrait être plus propre et une meilleure approche. Cet extrait fonctionne en conjonction avec la validation de l'attribut de la propriété liée "SelectedIDs" dans mon exemple, sur mon ViewModel de l'objet. "divCategories" est l'élément div contenant le kendo multi-sélectionnez contrôle. Celui-ci fonctionne pour moi maintenant, jusqu'à ce que je obtenir un nettoyeur approche:
Vous pourriez séparer la ligne de javascript dans une balise script ou dans un utilitaire fichier javascript de toute façon.
Bonne chance à qui foulera ce chemin..
OriginalL'auteur Sudhir