Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Saymon Souza

Validar campos com PHP e mostrar mensagem com jquery

Recommended Posts

Bom galera estou fazendo um painel de admin simples e quando vou validar os campos para exibir a mensagem com a função msg("Esse Login não é válido",'scesso'); simplesmente não aparece as mensagens e nada é mostrado no console, bom vou mandar os arquivos caso vocês possam me ajuda!!!

 

Arquivos para Download

 

Arquivo: custom.js

/*
$(document).ready(function(){
	$('form[name="form_login"]').submit(function(){				SELECIONA O FORMULARIO
		console.log('clicou');									APARECE 'CLICOU' PARA DEBUGAR
		$(this).fadeOut('fast'); 								OCULTA O FORM RÁPIDO QUANDO CLICA NO BOTÃO
		var botao = $(this).find(':button');					SALVA OS ATRIBUTOS DO BOTÃO NA VARIAVEL 'BOTAO'
		botao.attr('disabled', true);							DESABILITA O BOTÃO
		botao.html('Aguarde Carregando...');					ALTERA O QUE TEM ESCRITO NO BOTÃO
		
		console.log($(this).serialize());						RECUPERA OS VALORES DOS CAMPOS E MOSTRA NO CONSOLE
		return (false);
	});
});
*/

$(document).ready(function(){
	$('form[name="form_login"]').submit(function(){
		
		var forma = $(this);						//ARMAZENA O FORMULARIO FORM_LOGIN EM UMA VARIAVEL
		var botao = $(this).find(':button');		//SALVA OS ATRIBUTOS DO BOTÃO NA VARIAVEL 'BOTAO'
		
		$.ajax({
			url: "ajax/controller.php",				//DETERMINA A URL DO ARQUIVO QUE VAI PEGAR OS DADOS DO FORMULARIO COM PHP E ENVIA OS DADOS
			type: "POST",							//TIPO DOS DADOS QUE SERÃO PASSADOS PELO FORM
			data: "acao=login&"+forma.serialize(),	//PASSA UMA AÇÃO PARA O FORMULARIO E PEGA DOS DADOS
			beforeSend: function(){					//OQUE SERÁ FEITO ENQUANTO CARREGA A PÁGINA
				botao.html('Aguarde Carregando...').attr('disabled', true);		
			},
			success: function(retorno){
				botao.attr('disabled', false).html('<span class="glyphicon glyphicon-user"></span> Logar');
				if(retorno === 'noif'){
					msg("Esse Login não é válido",'scesso');
				}
			}
		});
		return false;	
	}); 
	
	
	//FUNÇÕES GERAIS
	function msg(msg,tipo){
		var retorno = $('.retornou');
		var tipo	=	(tipo === 'sucesso') ? 'success' : (tipo === 'alerta') ? 'warning' : (tipo === 'erro') ? 'danger' : (tipo === 'info') ? 'info' : alert('INFORME MENSAGENS DE SUCESSO, ALERTA, ERRO E INFO');
		console.log(tipo);
		
		retorno.empty().fadeOut('fast', function(){
			return $(this).html('<div class="alert alert-'+tipo+'">'+msg+'</div>').fadeIn('slow');	
		});
	}
	  
});

Arquivo: login.php

<?php 
sleep(1);
//FUNÇÃO DE LOGIN
function login($login, $senha){
	$pdo	=	conecta();
	
	try{
		$logar	=	$pdo -> prepare("SELECT * FROM administrador WHERE administrador_login = :login AND administrador_senha = :senha AND administrador_nivel <= '2'");
		$logar	->	bindValue(':login', $login, PDO::PARAM_STR);
		$logar	->	bindValue(':senha', $senha, PDO::PARAM_STR);
		$logar	->	execute();
		
		if($logar -> rowCount() == 1) : 
			return TRUE;
		else : 
			return FALSE;
		endif;
		
		
	}catch(PDOException $e){
		echo $e -> getMessage();
	}
//http://www.php.net/manual/pt_BR/pdo.constants.php
//http://www.php.net/manual/pt_BR/pdostatement.bindparam.php
//http://www.php.net/manual/en/filter.filters.sanitize.php
}

//PEGA LOGIN
function pegaLogin($login){
		$pdo	=	conecta();
	
	try{
		$bylogin	=	$pdo -> prepare("SELECT * FROM administrador WHERE administrador_login = :login");
		$bylogin	->	bindValue(':login', $login, PDO::PARAM_STR);
		$bylogin	->	execute();
		
		if($bylogin -> rowCount() == 1) : 
			return $bylogin -> fetch(PDO::FETCH_OBJ);//SUBSTITUI $DADOS['NOMEDOCAMPO']
		else : 
			return FALSE;
		endif;
		
		
	}catch(PDOException $e){
		echo $e -> getMessage();
	}
//http://www.php.net/manual/pt_BR/pdostatement.fetch.php
}
?>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pode ser em bootstrap?

 

http://www.caelum.com.br/apostila-html-css-javascript/bootstrap-e-formularios-html5/#11-4-exercicio-opcional-inicio-do-checkout-sem-php


Exemplo:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="include/jquery/jquery-1.8.0.js"></script>
<script src="bootstrap/js/bootstrap.js"></script>
<link href="bootstrap/css/bootstrap.css" rel="stylesheet" media="screen">
</head>
<body>
<form class="form-horizontal" name="form2" action="cadastra_pesquisa.php" method="POST" >
				<fieldset>
	 
					<!-- Form Name -->
					<legend>Formulário de Cadastro</legend>
					 
					<!-- Text input-->
					<div class="control-group">
					  <label class="control-label">Nome</label><!-- colocar width=80px; em vez de 160 -->
					  <div class="controls"><!-- colocar margin-left:100 em vez de 180-->
						<input id="nome" name="nome" type="text" placeholder="Insira seu nome" required> * Campo Obrigatório</p>
					  </div>
					  </div>
					  <div class="control-group">
					  <label class="control-label"></label>
					  <div class="controls"><!-- colocar no control text-align=left -->
						<button id="enviar" name="enviar" class="btn btn-primary">Enviar</button>
					  </div>
					</div>
</form>
</body>
</html>

Você teria que baixar o bootstrap e colocar na pasta.

 

Nesse código a pasta é bootstrap pura.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pode ser em bootstrap?

 

http://www.caelum.com.br/apostila-html-css-javascript/bootstrap-e-formularios-html5/#11-4-exercicio-opcional-inicio-do-checkout-sem-php

 

Exemplo:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><script type="text/javascript" src="include/jquery/jquery-1.8.0.js"></script><script src="bootstrap/js/bootstrap.js"></script><link href="bootstrap/css/bootstrap.css" rel="stylesheet" media="screen"></head><body><form class="form-horizontal" name="form2" action="cadastra_pesquisa.php" method="POST" >				<fieldset>	 					<!-- Form Name -->					<legend>Formulário de Cadastro</legend>					 					<!-- Text input-->					<div class="control-group">					  <label class="control-label">Nome</label><!-- colocar width=80px; em vez de 160 -->					  <div class="controls"><!-- colocar margin-left:100 em vez de 180-->						<input id="nome" name="nome" type="text" placeholder="Insira seu nome" required> * Campo Obrigatório</p>					  </div>					  </div>					  <div class="control-group">					  <label class="control-label"></label>					  <div class="controls"><!-- colocar no control text-align=left -->						<button id="enviar" name="enviar" class="btn btn-primary">Enviar</button>					  </div>					</div></form></body></html>

Você teria que baixar o bootstrap e colocar na pasta.

 

Nesse código a pasta é bootstrap pura.

Já estou utilizando o bootstrap o problema é que ele não mostra as mensagens da função msg();

 

 

Mais alguém????

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.