2012-05-19 27 views
6

Me refiero este artículo:anotación personalizada Asp.Net MVC 4

http://haacked.com/archive/2009/11/19/aspnetmvc2-custom-validation.aspx

que muestra cómo crear anotación personalizada en Asp.Net MVC 2. Sin embargo, los scripts de validación del lado del cliente , especialmente "MicrosoftMvcJQueryValidation" no está disponible en Asp.Net MVC4. Lo leí en un artículo que es parte del proyecto Asp.Net Futures. Quiero conectar mi validación del lado del cliente usando Jquery. En la carpeta de mi proyecto de escritura de la plantilla, veo guiones denominan:

jquery.validate.min.js 
jquery.validate.unobtrusive.min.js 
jquery.unobtrusive-ajax.min.js 

¿Hay alguna manera de que pueda hacer uso de estas secuencias de comandos existentes? ¿o tengo que descargar obligatoriamente el proyecto de futuros?

+1

Google "Validación personalizada MVC 3" y encontrará varios artículos como http://msdn.microsoft.com/en-us/vs2010trainingcourse_aspnetmvccustomvalidation_topic3 ​​y http://tdryan.blogspot.com/2010/12/aspnet- mvc-3-custom-validation.html – RickAndMSFT

+0

@RickAndMSFT: Esto es lo que sucede cuando publica enlaces a ciegas en preguntas que no leyó. http://msdn.microsoft.com/en-us/vs2010trainingcourse_aspnetmvccustomvalidation_topic3 ​​no se trata de la validación de Jquery. Utiliza MicrosoftMvcValidation.js para la validación del lado del cliente que no quiero, como dije claramente en la pregunta y http://tdryan.blogspot.in/2010/12/aspnet-mvc-3-custom-validation.html usa incorporado RegularExpressionAttribute que genera automáticamente el script del lado del cliente. No estoy usando RegularExpressionAttribute. Con base en sus enlaces, mejor no google: D –

+1

lea la respuesta debajo de mis tutoriales. No es difícil actualizarlos para MVC 4. Los conceptos son los mismos. – RickAndMSFT

Respuesta

14

Ese artículo es específico para MVC 2 que usó MicrosoftAjax. MVC 4 ya no incluye los archivos MS Ajax ya que han quedado obsoletos y el método preferido es usar jquery.

para verificar su configuración, asegúrese de que estas secuencias de comandos están en su diseño

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script> 
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script> 

Y estos dos ajustes están presentes en la sección de appSettings en su archivo web.config

<add key="ClientValidationEnabled" value="true"/> 
<add key="UnobtrusiveJavaScriptEnabled" value="true"/> 

Así que cuando se añadir anotaciones de datos a sus ViewModels se obtiene lado del cliente y la validación del lado del servidor, tanto

public class MyModel 
{ 
    [Required] 
    [StringLength(30)] 
    public string FirstName { get; set; } 

    [Required] 
    [StringLength(30)] 
    public string LastName { get; set; } 
} 

En su opinión sólo asegúrese de que tiene un código como éste

<div> 
    @Html.LabelFor(model => model.FirstName) 
</div> 
<div> 
    @Html.TextBoxFor(model => model.FirstName) <br/> 
    @Html.ValidationMessageFor(model => model.FirstName) 
</div> 

<div> 
    @Html.LabelFor(model => model.LastName) 
</div> 
<div> 
    @Html.TextBoxFor(model => model.LastName) <br/> 
    @Html.ValidationMessageFor(model => model.LastName) 
</div> 

actualización

He aquí un ejemplo de un validador personalizado que he llamado RateRequiredIfCustomIndexRate Este es el lado Javascript de ella para que se se agrega a la validación de jQuery

$("document").ready(function() { 

    var isCustomRateRequired = document.getElementById("IsCustomRateRequired"); 

    isCustomRateRequired.onchange = function() { 
     if (this.checked) { 
      $('#Rate').attr('disabled', 'disabled'); 
      $('#Rate').val(''); 
     } 
     else { 
      $('#Rate').removeAttr('disabled'); 
     } 
    }; 
}); 

jQuery.validator.addMethod("raterequiredifcustomindexrate", function (value, element, param) { 
    var rateRequired = $("#CustomRateRequired").val(); 
    if (rateRequired && value == "") { 
     return false; 
    } 
    return true; 
}); 

jQuery.validator.unobtrusive.adapters.addBool("raterequiredifcustomindexrate"); 
+0

Entonces, ¿cómo conecto la validación de mi cliente con estos scripts? ¿Algún tutorial? ¿artículo? –

+0

Eso es fácil, lo obtienes gratis :-) cuando decoras tus clases de ViewModel con anotaciones de datos, esas mismas reglas se traducen a las reglas del lado del cliente ... actualizando mi respuesta ahora –

+0

¿Es eso realmente posible? Esta es mi anotación de validación personalizada. He extendido usando *** ValidationAttribute *** ¿Cómo se traduce mi validación del lado del servidor del código C# automáticamente al lenguaje Jquery? Tengo curiosidad –

10

la clave que falta aquí es que el validador del lado del servidor debe implementar la interfaz IClientValidatable:

public class RateRequiredIfCustomIndexRateAttribute : ValidationAttribute, IClientValidatable 
{ 
    public override bool IsValid(object value) 
    { 
     return false; 
    } 

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context) 
    { 
     yield return new ModelClientValidationRule 
     { 
      ErrorMessage = this.ErrorMessage, 
      ValidationType = "raterequiredifcustomindexrate" 
     }; 
    } 
} 

Una vez que hace eso, la validación del lado del cliente debe estar conectada correctamente. Puede verificar esto asegurándose de que su campo de entrada tenga un atributo "data-val-raterequiredifcustomindexrate".

Cuestiones relacionadas