asp.net - validacion - validar formulario javascript html5

¿Puede tener una validación personalizada de javascript en el lado del cliente para validador de formularios web ASP.NET estándar?

Question

¿Puede tener una validación personalizada de javascript en el lado del cliente para validador de formularios web ASP.NET estándar?

Por ejemplo, use un asp: RequiredFieldValidator deje el código del lado del servidor solo, pero implemente su propia notificación al cliente utilizando jQuery para resaltar el campo o el color de fondo, por ejemplo.

Answer 1

El CustomValidator estándar tiene una propiedad ClientValidationFunction para eso:

<asp:CustomValidator ControlToValidate="Text1" 
                     ClientValidationFunction="onValidate" />

<script type=''text/javascript''>
function onValidate(validatorSpan, eventArgs)
 { eventArgs.IsValid = (eventArgs.Value.length > 0);
   if (!eventArgs.IsValid) highlight(validatorSpan);
 }
</script>

Answer 2

Lo que puede hacer es conectar el validador y asignar un nuevo método de evaluación, como este:

  <script type="text/javascript">
        rfv.evaluationfunction = validator;

        function validator(sender, e) {
            alert(''rawr'');
        }
    </script>

rfv es la ID de mi validador de campo requerido. Tienes que hacer esto en la parte inferior de la página para que se lo asigne después de que se haya registrado javascript para el validador.

Es mucho más fácil usar CustomFieldValidator y asignar su propiedad de validación del lado del cliente.

<asp:CustomValidator ControlToValidate="txtBox" ClientValidationFunction="onValidate" />

<script type=''text/javascript''>
function onValidate(sender, e)
 { 
     alert(''do validation'');
 }
</script>

Consulte la documentación aquí y aquí .

Answer 3

Sí, lo he hecho. Utilicé Firebug para descubrir las funciones Dot.Net JS y luego secuestré las funciones del validador

Lo siguiente se aplicará a todos los validadores y es puramente del lado del cliente. Lo uso para cambiar la forma en que se muestra la validación de ASP.Net, no la forma en que se realiza la validación. Debe estar empaquetado en $ (documento). Listo () para asegurarse de que sobrescribe la validación original de ASP.net.

/**
 * Re-assigns a couple of the ASP.NET validation JS functions to
 * provide a more flexible approach
 */
function UpgradeASPNETValidation(){
    // Hi-jack the ASP.NET error display only if required
    if (typeof(Page_ClientValidate) != "undefined") {
        ValidatorUpdateDisplay = NicerValidatorUpdateDisplay;
        AspPage_ClientValidate = Page_ClientValidate;
        Page_ClientValidate = NicerPage_ClientValidate;
   }
}

/**
 * Extends the classic ASP.NET validation to add a class to the parent span when invalid
 */
function NicerValidatorUpdateDisplay(val){
    if (val.isvalid){
        // do custom removing
        $(val).fadeOut(''slow'');
    } else {
        // do custom show
        $(val).fadeIn(''slow'');
    }
}

/**
 * Extends classic ASP.NET validation to include parent element styling
 */
function NicerPage_ClientValidate(validationGroup){
    var valid = AspPage_ClientValidate(validationGroup);

    if (!valid){
        // do custom styling etc
        // I added a background colour to the parent object
        $(this).parent().addClass(''invalidField'');
    }
}