Cómo personalizar el mensaje de error de maxlength con jQuery validate para mostrar el número de caracteres ingresados

Question

Quiero que la validación maxlength de jQuery validate muestre un mensaje de error como el siguiente:

" Por favor, no ingrese más de {0} caracteres. Actualmente has introducido {1} caracteres. & Quot;

Donde {1} es un marcador de posición para la cantidad real. ¿Cuál es la mejor manera de hacer esto?

Answer 1

No creo que haya una forma simple de hacerlo, pero encontré una solución para ti. Supongo que podrías escribir tu propio validador para ese campo, pero esto puede ser más simple.

Comience cambiando el mensaje predeterminado para los errores maxlength :

$.extend($.validator.messages, {  
    maxlength: $.validator.format("Please enter no more than {0} characters. You've currently entered CHARS_NO characters.")
});

Mantenga la validación como de costumbre, pero agregue esta función:

$('input').keyup(function () {
    var rules = $(this).rules();
    if (rules.maxlength !== undefined && !$(this).valid()) {
        var errorLabel = $('label[for=' + $(this).attr('id') + '][generated=true].error');
        errorLabel.text(errorLabel.text().replace('CHARS_NO', $(this).val().length));
        return false;
    }
});

Aquí está la demostración de trabajo para usted.

Answer 2

No estoy seguro de cómo está activando la validación, pero el atributo maxlength en una input impedirá que el usuario ingrese más caracteres de lo que indique el valor . Por lo tanto, no será necesario informar al usuario de que ha ingresado más caracteres que maxlength , ya que simplemente no pueden hacerlo.

¿Puede proporcionar contexto y / o detalles adicionales?