Modificar cor de um imput JQuery

2 respostas
wellingtonamaralleit

Estou fazendo uma validação e tenho que mudar a cor do campo que estiver vazio no meu caso não tenho id dos input, no primeiro campo eu consegui acessar por div input:first, já no segundo tentei colocar second, mas parece que não dá, alguém pode me ajudar?

$("#login").submit(function() {
			if ($("div input:first").val() == "") {
				
				$("div input:first").css('background', 'red');
				//$("span").text("Validated...").show();
				//return true;
			}

2 Respostas

igrsantos

tente esse código aqui amigo:

$("#login").submit(function() { $(this).children("div input:first").each(function(){ if ($(this).val() == "") { $(this).css('background', 'red'); } }) })
dica de um amigo aqui ! prg’

W

igrsantos:
tente esse código aqui amigo:

$("#login").submit(function() {
    $(this).children("div input:first").each(function(){
        if ($(this).val() == "") {
            $(this).css('background', 'red');
	}
    })
})

dica de um amigo aqui ! prg’

Isso nao vai funcionar.

"div input:first"

Vai retornar somente o first input element, entao o each vai fazer o loop em somente um item.

O correto seria:

$("#login").submit(function() {
    $(this).children("div input").each(function(index, input){
        if ($(input).val() == "") {
            $(input).css('background', 'red');
	}
    })
})

O MAIS correto ainda, eh nao fazer a validacao dessa forma e sim, usar o jquery.validate, por exemplo, suponha que vc tenha esse HTML:

<form id="cadastroCliente">
   <input type="text" id="clientName">
   <button id="btn">
</form>

Javascript:

$("#cadastroCliente").validate({
       rules: {       
           clientName: {
               required: true
           }
       },
       messages: {          
            clientName: {
                required: "* O campo nome nao pode ser branco" 
            }
       }
 });

 $("#btn").on("click", function (e) {
    if (!$("#cadastroCliente").valid()) {
       e.preventDefault();
    }
});

O jquery.validate vai se encarregar de mudar a cor dos campos e mostrar as mensagens de erro.

//Daniel

Criado 5 de junho de 2013
Ultima resposta 17 de jun. de 2013
Respostas 2
Participantes 3