[Resolvido] Aciona botão com jQuery

[janick 1]

Cara, minha alegria durou apenas pouco tempo.

 

A história do botão sim, está ok.

 

Porém perdi a mão no esquema de verificação agora com a utilização do keypress =/

 

Antes estava assim:

 

- Faz o foco no input.

- Se digitar, ok, não faz nada.

- Se digitar e tirar o foco, ok, não faz nada.

- Se focar e tirar o foco sem ter digitado nada, adicionar uma classe "faltou", pisca a div pai de vermelho e mantem uma borda vermelha no input.

- Se digitar em algum input que esta marcado como "faltou", tira a classe "faltou", pisca verde e remove a borda vermelha.

 

O que acontece agora é que os eventos estão como keypress e change (select), e eu não estou sabendo como fazer para realizar exatamente os comportamentos acima com eventos diferentes keypress ou change.

 

To usando a função "verificacao" que você sugeriu acima...

 

 

 

 

é válido sim.

 

que bom q resolveu. :lol:

[William Bruno 1501]

tecnicamente, não precisa fazer nada de diferente.

 

independente de ser blur ou keypress, deve funcionar o comportamento q você citou.

qual o erro ?

[janick 1]

Quando eu começo a digitar ele já roda o item 4 que falei na lista.

 

Isto é, se ele não tiver a classe faltou, roda a parada, só que claro que ele nao vai ter a classe faltou se o cara comecou a digitar agora. to me enrolando com a lógica.

 

O trecho é:

 

	if($(this).val() == "" || $(this).val() == "Selecione" || $(this).val() == "Número") {

		if(!$(this).hasClass('faltou')) {

			$(this).parent().css('background-color', 'red').animate({ backgroundColor: '#f9f9f9' }, 1000);
			$(this).css('border-color', 'red');
			$(this).addClass('faltou');
			$(this).addClass('pendente');

		}

[William Bruno 1501]

e todos começam "faltando" certo ?

 

então de inicio, antes de tudo, você precisa adicionar essa tua class:

 $('input.obrigatorio').addClass( 'faltou' );

[janick 1]

não, o "faltou" é só para o caso do usuário focar e desfocar no campo sem digitar nada. este ficam como "faltou".

 

todos começam com a classe "pendente", e na medida que vao preenchendo, elas são removidas.

[William Bruno 1501]

Ok, então adicione o seguinte:

 

 

 $('input.obrigatorio').blur(function(){
   if( $( this ).val()=='' )
      $( this ).addClass('faltou');
});

[janick 1]

Fora mesmo de "verificacao" ? Tipo isso:

não rolou ainda

quando começo a digitar em qq campo ele já pisca vermelho

 

	// Primeira validação dos campos

$('.btn-proximo-passo').fadeTo('slow', 0.3);
$('.obrigatorio:visible').addClass('pendente');

var verificacao = function(){

	/*
	- Faz o foco no input. (tanto faz, isso nao influencia em nada)
	- Se digitar, ok, não faz nada, só remove a classe pendente
	- Se digitar e tirar o foco, ok, não faz nada.
	- Se focar e tirar o foco sem ter digitado nada, adicionar uma classe "faltou", pisca a div pai de vermelho e mantem uma borda vermelha no input.
	- Se digitar em algum input que esta marcado como "faltou", tira a classe "faltou", pisca verde e remove a borda vermelha.
	*/

	if($(this).val() == "" || $(this).val() == "Selecione" || $(this).val() == "Número") {

		if(!$(this).hasClass('faltou')) {

			$(this).parent().css('background-color', 'red').animate({ backgroundColor: '#f9f9f9' }, 1000);
			$(this).css('border-color', 'red');
			$(this).addClass('faltou');
			$(this).addClass('pendente');

		}

	} else {

		$(this).removeClass('pendente');

		if($(this).hasClass('faltou')) {

			$(this).parent().css('background-color', 'green').animate({ backgroundColor: '#f9f9f9' }, 1000);
			$(this).css('border-color', '#d0d0d0');
			$(this).removeClass('faltou');
			$(this).removeClass('pendente');

		}

	}

	if($('.pendente').length == 0) {

		$('.btn-proximo-passo').animate( { 'opacity' : 1 }, 100 );
		$('.btn-proximo-passo').css('cursor','pointer').attr('disabled', false);

	} else {

		$('.btn-proximo-passo').animate( { 'opacity' : .3 }, 100 );
		$('.btn-proximo-passo').css('cursor','default').attr('disabled', true);

	}

};

$('input.obrigatorio').blur(function(){

	if($(this).val() == '') {

		$(this).addClass('faltou');

	}

});

$('input.obrigatorio').keypress( verificacao );

$('input.obrigatorio').blur(function(){

	if($(this).val() == '') { $(this).addClass('faltou'); }
	verificacao;

});

$('select.obrigatorio').change( verificacao );

 

 

 

Ok, então adicione o seguinte:

 

 

 $('input.obrigatorio').blur(function(){
   if( $( this ).val()=='' )
  	$( this ).addClass('faltou');
});