Como resolver o problema ao usar o jQuery datepicker e a validação ao mesmo tempo
-
23-09-2019 - |
Pergunta
Quando usei o DatePicker com o ícone do gatilho para que os usuários pudessem escolher a data de clicar neste ícone ou digitar diretamente na caixa de texto (txtdate), também usei a validação do jQuery para exigir que a caixa de texto não deve estar vazia. Mas quando um usuário envia o formulário com caixa de texto vazia (txtdate.text = ""), a mensagem de erro da validação pressiona o ícone do gatilho à direita. Você poderia me dizer a solução? Muito obrigado!
Solução
$('#some_form').validate({
rules: {...},
messages: {...},
errorPlacement: function(error, element) { //solve you problem
var trigger = element.next('.ui-datepicker-trigger');
error.insertAfter(trigger.length > 0 ? trigger : element);
}
});
Outras dicas
A função de substituição de erro recebe dois parâmetros - a mensagem de erro e o elemento validado. Use o último para decidir se deve ou não personalizar a colocação para seus campos (por exemplo, adicionando uma classe):
$('form').validate({
rules: {...},
errorPlacement: function(error, element) {
if (element.hasClass('customError')) {
// custom error placement
}
else {
element.after(error); // default error placement
}
}
});
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow