0

Tengo lo siguiente:

$('#myForm').validate({
    errorClass: "invalido",
    validClass: "success",
    rules: {
        country: {
            required: true
        },
        zip_code: {
            maxlength: 4,
            depends: function (element) {
                return $("#country").val() == 'AT';
            }
        },
        zip_code:{
            maxlength: 5
        }
    },
    //Mensajes
    messages: {
        country: $required,
        },
        zip_code:{
            maxlength: 'xxxx'
        }
    }
});

El tema es que necesito que el maxlength de zip_code sea 4 cuando el valor de country es AT y en el resto de los casos sea 5. Y en función de eso que muestre un mensaje u otro. He probado con la función pero no doy con la tecla. ¿Alguna ayuda? Gracias

2 respuestas 2

1

Lo que debes hacer es asignar una función a tu maxlength que evalué el valor que debe devolver de acuerdo a tu otro campo country. Recuerda que la acción de validación de zipcode se hará cuando pierda el focus. Use el ejemplo de la documentación Aqui. Si lo que deseas es que la regla se aplique ni bien cambies el valor de tu campo country entonces deberás usar la función .rules() con la función change de tu campo para agregar y quitar la regla de maxlength,te dejo la informacion Aqui

<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://jqueryvalidation.org/files/demo/site-demos.css">
 
</head>
<body>
<form id="myform">
<label>Country </label>
<input id="country" name="country">
<br>
<label>Zipcode </label>
<input id="zipcode" name="zipcode">
<br>
<input type="submit" value="Validate!">
</form>
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>
<script>
// just for the demos, avoids form submit
jQuery.validator.setDefaults({
  debug: true,
  success: "valid"
});
$( "#myform" ).validate({
  rules: {
    country: {
      required: true
    },
    zipcode: {
    required: true,
      maxlength: function(element) {
         if ($("#country").val() =='AT')
              return 4;
         return 5;
      }
    }
  }
});
</script>
</body>
</html>

1
  • Muchas gracias. Funcionó correctamente.
    – Jose
    Commented el 27 feb. 2018 a las 16:36
0

Si tu condición solamente depende de ese valor, el de country, podrías tratar de implementar un Operador condicional (ternario) "?" en la regla.

$('#myForm').validate({
        errorClass: "invalido",
        validClass: "success",
        rules: {
            country: {
                required: true
            },
            zip_code: {
                maxlength: $("#country").val() == 'AT' ? 4 : 5
            }
        },
        //Mensajes
        messages: {
            country: $required,
            },
            zip_code:{
                maxlength: 'xxxx'
            }
        }
    });
3
  • Hola @Juan Patrono Por desgracia no me funciona. Añadí la misma regla para el mensaje del maxlength maxlength: $("#country").val() === 'AT' ? 'FOO' : 'BAR' Pero tampoco funciona
    – Jose
    Commented el 27 feb. 2018 a las 15:18
  • Podrías chequear que el valor $('#country).val() sea el correcto ?, es decir que venga el valor 'AT' en sus respectivos casos. También deberías tener en cuenta que según la documentación de la función validate, los campos se deben definir una sola vez. De ser afirmativo, chequear la consola en busca de algún error y posteame por aquí Commented el 27 feb. 2018 a las 15:48
  • Hola. Si. Es un select y el valor es AT $(document).on('change', '#country', function () { console.log($('#country').val()); }); Y me va señalando los valores y como digo muestra AT que corresponde a Austria.
    – Jose
    Commented el 27 feb. 2018 a las 16:05

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.