[Resolvido] Validação em pagina form carrego em div via ajax

[Monkey D. Luffy 0]

Desculpem minha insistencia, mas tentando resolver esse problema fiz o seguinte:

 

adicionei essa rotina de validação dentro de uma função chamada valida() e tb adicionei um alert antes de executar todo o resto e chamei essa função valida apos o .live('click') que é uma outra rotina responsavel por enviar a pagina

 

porem o que acontece é o seguinte quando eu clico em enviar, independente de estar preenchido ou não o formulario é enviado e a validação é ignorada porem o alert é acionado.... fiz isso para tirar minhas duvidas... agora?

o que esta acontecendo? rsrsrs

 

como impedir que o formulario seja submetido se estive sem preenchimento?

 

function valida(){

alert(0);
//validação do formulario comentadio
$(document).ready( function() {

           $("#form_comentario").validate({
               // Define as regras
               rules:{
           "nome":{
               // campoNome será obrigatório (required) e terá tamanho mínimo (minLength)
                       required: true, minlength: 5
                   },
                   "msg":{
                       // campoMensagem será obrigatório (required) e terá tamanho mínimo (minLength)
                       required: true, minlength: 2
                   }
               },
               // Define as mensagens de erro para cada regra
               messages:{
                   "nome":{
                       required: "Digite o seu nome",
                       minlength: "O seu nome deve conter, no mínimo, 2 caracteres"
                   },
                   "msg":{
                   required: "Digite a sua mensagem",
               minlength: "A sua mensagem deve conter, no mínimo, 2 caracteres"
                   }
               }
           });
       });

}

//Função mural de recados
$(function(){

       $('.btn').live('click', function(){

       valida()
               var nome = $('#nome').val();
               var msg = $('#msg').val();

               $(".formulario_comentario").html('<span id="spanEnviandoComentario"><img src="imagens/loader.gif" alt="" /></span>');

               $.post('cadastra_comentario.php', {

                       nome_post: nome,
                       msg_post: msg,

               }, function(res_cadastra){                      
                       $(".formulario_comentario").html(res_cadastra);

                       $.post('atualiza_comentario.php', function(atualiza_comentarios){                       
                               $("#comentarios ul").html(atualiza_comentarios);                        
                       });

               });

               return false;   

       });


});

[Fernando Neto MH 13]

Cara no formulário tem ação tipo:

<form onsubmit="valida();">

 

Se não tiver coloque e faça isto em seu code pra ver se dá certo

 

function valida(){

alert("O FORMULÁRIO FOI SUBMETIDO");
//validação do formulario comentadio


           $("#form_comentario").validate({
               // Define as regras
               rules:{
           "nome":{
               // campoNome será obrigatório (required) e terá tamanho mínimo (minLength)
                       required: true, minlength: 5
                   },
                   "msg":{
                       // campoMensagem será obrigatório (required) e terá tamanho mínimo (minLength)
                       required: true, minlength: 2
                   }
               },
               // Define as mensagens de erro para cada regra
               messages:{
                   "nome":{
                       required: "Digite o seu nome",
                       minlength: "O seu nome deve conter, no mínimo, 2 caracteres"
                   },
                   "msg":{
                   required: "Digite a sua mensagem",
               minlength: "A sua mensagem deve conter, no mínimo, 2 caracteres"
                   }
               }
           });

}

//Função mural de recados
$(document).ready( function() {

       $('.btn').live('click', function(){

       valida()
               var nome = $('#nome').val();
               var msg = $('#msg').val();

               $(".formulario_comentario").html('<span id="spanEnviandoComentario"><img src="imagens/loader.gif" alt="" /></span>');

               $.post('cadastra_comentario.php', {

                       nome_post: nome,
                       msg_post: msg,

               }, function(res_cadastra){                      
                       $(".formulario_comentario").html(res_cadastra);

                       $.post('atualiza_comentario.php', function(atualiza_comentarios){                       
                               $("#comentarios ul").html(atualiza_comentarios);                        
                       });

               });

               return false;   

       });


});

 

Qualquer coisa grita aê mano

[Monkey D. Luffy 0]

nem deu certo mano ele ate manda a mensagem mas a validção nem funciona e depois ele submite mesmo assim o form

[Dellacurtais 36]

So Ideia, Não seria melhor Usar -> Clique aqui

[Monkey D. Luffy 0]

So Ideia, Não seria melhor Usar -> Clique aqui

 

 

Nunca utilizei.. como seria?

[Monkey D. Luffy 0]

Pessoal eu estou quase conseguindo , o código estava assim

 

//validação do formulario comentadio
$(document).ready( function() {

    $("#form_comentario").validate({
        // Define as regras
        rules:{
           "nome":{
               // campoNome será obrigatório (required) e terá tamanho mínimo (minLength)
                required: true, minlength: 5
            },
            "msg":{
                // campoMensagem será obrigatório (required) e terá tamanho mínimo (minLength)
                required: true, minlength: 2
            }
        },
        // Define as mensagens de erro para cada regra
        messages:{
            "nome":{
                required: "Digite o seu nome",
                minlength: "O seu nome deve conter, no mínimo, 2 caracteres"
            },
            "msg":{
            required: "Digite a sua mensagem",
               minlength: "A sua mensagem deve conter, no mínimo, 2 caracteres"
            }
        }
    });
});


//Função mural de recados
$(function(){

$('.btn').live('click', function(){

valida()
	var nome = $('#nome').val();
	var msg = $('#msg').val();

	$(".formulario_comentario").html('<span id="spanEnviandoComentario"><img src="imagens/loader.gif" alt="" /></span>');

	$.post('cadastra_comentario.php', {

		nome_post: nome,
		msg_post: msg,

	}, function(res_cadastra){			
		$(".formulario_comentario").html(res_cadastra);

		$.post('atualiza_comentario.php', function(atualiza_comentarios){			
			$("#comentarios ul").html(atualiza_comentarios);			
		});

	});

	return false;	

});


});

 

primeiro eu clico no botão e valida se tiver tudo ok ele executa essa segunda função mas dessa forma que ai de cima não funcionava pois eu carrego as pagina com ajax...

 

ai eu fiz o seguinte:

 

//validação do formulario comentadio
$('.btn').live('click', function(){

    $("#form_comentario").validate({
        // Define as regras
        rules:{
           "nome":{
               // campoNome será obrigatório (required) e terá tamanho mínimo (minLength)
                required: true, minlength: 5
            },
            "msg":{
                // campoMensagem será obrigatório (required) e terá tamanho mínimo (minLength)
                required: true, minlength: 2
            }
        },
        // Define as mensagens de erro para cada regra
        messages:{
            "nome":{
                required: "Digite o seu nome",
                minlength: "O seu nome deve conter, no mínimo, 2 caracteres"
            },
            "msg":{
            required: "Digite a sua mensagem",
               minlength: "A sua mensagem deve conter, no mínimo, 2 caracteres"
            }
        }
    });		

//Função mural de recados
$('.btn').click(function(){

	var nome = $('#nome').val();
	var msg = $('#msg').val();

	$(".formulario_comentario").html('<span id="spanEnviandoComentario"><img src="imagens/loader.gif" alt="" /></span>');

	$.post('cadastra_comentario.php', {

		nome_post: nome,
		msg_post: msg,

	}, function(res_cadastra){			
		$(".formulario_comentario").html(res_cadastra);

		$.post('atualiza_comentario.php', function(atualiza_comentarios){			
			$("#comentarios ul").html(atualiza_comentarios);			
		});

	});

	return false;	

});
});

 

mudei a validação ao invez do $(document).ready eu usei o live

 

e joguei a 2 função dentro dentro da primeira.

Então ela quase funciona porém so tem um probleminha...

Se eu clicar no botão e estiver vazio ele valida e não envia o formulario.. ate ai beleza né, ai se eu digito algo nelas ela envia o formulario e ai tudo bonitooo mass o seguinte se eu clicar e estiver vazio e tornar a clicar novamente ele não faz a validação e envia o form mesmo sem dados... o que eu faço para mesmo que se o usuario clicar mais de uma vez ele der certo??

Obrigado

[William Bruno 1501]

isso aqui:

$('.btn').live('click', function(){

           $("#form_comentario").validate({

está errado.

 

deixe apenas:

$("#form_comentario").validate({

para usar plugins com ajax, leia:

 

http://wbruno.com.br/2011/08/22/usando-lightbox-em-pagina-carregada-ajax/

[Monkey D. Luffy 0]

se eu fizer isso ai que o trem não funciona :/

[William Bruno 1501]

Essa é a forma correta.

 

Leia o link que postei. Lá eu explico como fazer um plugin funcionar em uma página carregada com ajax.

[Monkey D. Luffy 0]

certo Wilian, mas eu tenho 2 funções e uma delas submetem o form como eu faria para que a que a segunda so submetesse caso todos campos fossem validados?

 

seria uma dentro da outra como fiz?

 

//validação do formulario comentadio
$('.btn').live('click', function(){

    $("#form_comentario").validate({

    	submitHandler: function(form) {
  		 $(form).submit(function(){

  		 //Função mural de recados
      		 var nome = $('#nome').val();
	 var msg = $('#msg').val();

	$(".formulario_comentario").html('<span id="spanEnviandoComentario"><img src="imagens/loader.gif" alt="" /></span>');

	$.post('cadastra_comentario.php', {

		nome_post: nome,
		msg_post: msg,

	}, function(res_cadastra){			
		$(".formulario_comentario").html(res_cadastra);

		$.post('atualiza_comentario.php', function(atualiza_comentarios){			
			$("#comentarios ul").html(atualiza_comentarios);			
		});

	});

	return false;
       	return flase;
   		});
 		  },

        // Define as regras
        rules:{
           "nome":{
               // campoNome será obrigatório (required) e terá tamanho mínimo (minLength)
                required: true, minlength: 5
            },
            "msg":{
                // campoMensagem será obrigatório (required) e terá tamanho mínimo (minLength)
                required: true, minlength: 2
            }
        },
        // Define as mensagens de erro para cada regra
        messages:{
            "nome":{
                required: "Digite o seu nome",
                minlength: "O seu nome deve conter, no mínimo, 2 caracteres"
            },
            "msg":{
            required: "Digite a sua mensagem",
               minlength: "A sua mensagem deve conter, no mínimo, 2 caracteres"
            }
        }
    });	    

});

 

ou teria que ser fora?

 

acesse: http://jeferson.lucianocasale.com/principal.php

 

e vai no menu comente....

[William Bruno 1501]

tá errado tb cara.. você ta colocando uma função dentro da outra.

 

Basta isso aqui:

http://wbruno.com.br/2011/03/21/validar-enviar-formulario-ajax-usando-jquery-validate/

 

 

e para ativar o plugin na página carregada com ajax, é só seguir isso:

http://wbruno.com.br/2011/08/22/usando-lightbox-em-pagina-carregada-ajax/

 

 

Esquece o .live(), e esquece o .submit(), já que você tá usando o .validate(), você não precisa desses 2.

[Monkey D. Luffy 0]

entendi, mas realmente não estou conseguindo fazer esse esquema que você fez com o ligthbox para o validate.. no caso tenho que deixar a rotina do validate e depois criar uma segunda fazendo aquele esquema que você fez?

[William Bruno 1501]

Não. Mostre qual o código que você usa para carregar as páginas com ajax.

[Monkey D. Luffy 0]

Não. Mostre qual o código que você usa para carregar as páginas com ajax.

 

 

 

function abrirPag(valor){
var url = valor;

xmlRequest.open("GET",url,true);
xmlRequest.onreadystatechange = conteudo_mostrar;
xmlRequest.send(null);

if (xmlRequest.readyState == 1) {
document.getElementById("conteudo_mostrar").innerHTML = "<div id='preload'><img src='imagens/loader.gif'></div>";
}

return url;
}

function conteudo_mostrar(){
if (xmlRequest.readyState == 4){
document.getElementById("conteudo_mostrar").innerHTML = xmlRequest.responseText; 


}
}

 

ja tentei carregar utilizando o jquery porem me deu uns problemas tb na hora de chamar outras paginas :/

[William Bruno 1501]

aqui neste instante:

 

document.getElementById("conteudo_mostrar").innerHTML = xmlRequest.responseText; 

é qndo você insere a resposta do ajax no dom.

 

Basta depois disso invocar o teu validate(), caso esteja na página do formulário.

[Monkey D. Luffy 0]

aqui neste instante:

 

document.getElementById("conteudo_mostrar").innerHTML = xmlRequest.responseText; 

é qndo você insere a resposta do ajax no dom.

 

Basta depois disso invocar o teu validate(), caso esteja na página do formulário.

 

tipo isso é algo generico que uso para todas paginas.. não ira influenciar em nada nas outras?

 

de uma olhada aqui : www.jeferson.lucianocasale.com/principal.php

acesse o menu comente so para você ter uma ideia de como esta

[William Bruno 1501]

sim, por isso você tem q fazer o que eu disse:

 

invocar o teu validate(), caso esteja na página do formulário.

ou seja, um if() para saber se vai carregar o form. E se for, então ativar o validate()

[Monkey D. Luffy 0]

Cara de verdade que surra que eu estou levando disso.. acho que estou mais confuso ainda :/

 

ou seja agora nem sei por onde começar kkkk

 

estou tentando entender como posso usar aqueel esquema que você fez =/ mas não consigo rsrss

[William Bruno 1501]

Então para de olhar para esse código, e dá uma estudada em javascript e ajax. Isoladamente.

 

Não tem outra saída. A solução para o seu problema eu já disse qual é. Mas você precisa entender para usá-la.

[Monkey D. Luffy 0]

vamos tentar de novo: a mina função validate esta correta certo? eu devo chamar ela agora la onde carrego o ajax? ta e a funçãoq ue é resposnvel por submeter o formulario?