PHP + Jquery + Ajax assíncrono dinâmico e sistemático

[WM _ Guilherme Ferrolli 0]

primeiramente vamos baixar a base do jquery, e anexar na nossa index

Jquery fonte

neste tutorial vou ensinar (diferente do meu último) como criar querys ,rodar phps sem refresh na página de uma maneira a la Jquery (escreva menos, faça mais).

o Jquery é muito fácil de entender e muito simples de se executar, sendo executado na maioria dos navegadores, com alguns plugins apenas que não rodam, se não me engano apenas no IE6, sendo assim muito acessível e prático.

espero que entendam a formatação do meu post estar toda "desgraçada" mas estou neste momento em uma lan e é muito ruim aqui hehe.

mas se der edito o post em casa.

então começa aqui.

 

primeiro o jquery

 

<script type="text/javascript"> 
$('document').ready(function(){
	$('#nome').click(function() { //quando clicar no input com id "nome"  o value dele volta a zero
	$('#nome').val('');
});	$('#senha').click(function() { //quando clicar no input com id "senha"  o value dele volta a zero
	$('#senha').val('');
});


	$('#enviar').click(function() {//aqui determinamos que quando for clicado 
                                       //no tag com a id "enviar" sera executada esta função
	var options = {                //estas opções podem ser colocadas diretamente dentro de ajaxSubmit("aqu")
	target:        '#login',   //a div que vai ser alterada com a resposta do servidor
	success:alert("login bem sucedido"), //qualquer função a ser executada quando a resposta for TRUE
	url: "login.php",  //php que vai ser rodado pelo JS
	resetForm: true // aqui ele limpa a form
	};
    $('#formulario').submit(function() { 
        $(this).ajaxSubmit(options); 
		
        return false; //sempre use return false para que o browser não execute a sua função indevidamente
    }); 
								
});

</script>

login.php

<?php
$conectar = mysql_connect("servidor","usuario","suasenha");
$banco = mysql_select_db("banco_de_dados");
$login = $_POST['nome'];
$senha = $_POST['senha'];
$sql = mysql_query("SELECT * FROM `usuarios` WHERE `usuario`.`login` LIKE '$login' AND `usuario`.`senha` LIKE '$senha'");
$verifica = mysql_num_rows($sql);

if($verifica != 0) {//colocamos diferente de zero e não igual a um porque algumas pessoas acabam esquecendo e
while($col = mysql_fetch_array($sql)) { //criam scripts que adicionam mais de uma ves o mesmo login
$nome = $col['nome'];
echo utf8_encode("bem vindo $nome");  //hack para caracteres especiais utf8_encode muito legal ;D
}
}
else {
eho utf8_encode("usuario não encontrado");
}
?>

estrutura

<div id="login"><!-- esta ´div recebera informações do servidor trocando seu conteudo "html" interno para a resposta do servidor-->
<form id="formulario" method="post">
<input id="nome" value="nome" name="nome"/>
<input id="senha" value="senha" type="password" name="senha"/>
<input type="submit" id="enviar"/>
</form>

</div>

e é isso ai.

não fiz muita firula no post.

quando eu terminar meu site eu lanço ele com todos os plugins para download e demonstração.

abraços e bons estudos.

;)

[William Bruno 1501]

uma melhoria para o trecho:

$('#nome').click(function() { //quando clicar no input com id "nome"  o value dele volta a zero
        $('#nome').val('');
});     $('#senha').click(function() { //quando clicar no input com id "senha"  o value dele volta a zero
        $('#senha').val('');
});

é usar melhor os seletores:

$("input[name='nome']").click(function(){
		$( this ).val('');
	});    
	$("input[name='senha']").click(function(){
		$( this ).val('');
	});

espera-se que cada par: login|senha, corresponda a apenas um único usuário, portanto, o loop é desnecessário.

melhor seria ter feito:

$col = mysql_fetch_assoc($sql);

já que a parte numérica do retorno do fetch_array(), não é usada, com o assoc() será mais rápido o script, e teremos o mesmo funcionamento.

 

Não acho 'interessante', fazer a comparação com um LIKE , pois assim, algumas anomalias podem validar o login, sendo que deveriam ser barradas.

[WM _ Guilherme Ferrolli 0]

Olá William.

Realmente você tem razão sobre o uso dos seletores no Jquery, fica bem mais curto, direto e seguro daquela forma, claro que se eu tiver mais de uma form com name=nome ou name=senha complica, mas isso só acontece quando fazemos gambiarras, como ter 3 forms na mesma página e usar o hide() para esconder as que não foram escolhidas quando o certo seria usar um load() ou $.get, para que ele troque o valor da div que contém a form.

Valeu a dica.

Sobre o mysql_fetch_assoc(), realmente no seu script não ia ser necessário, falei , talvez de maneira não clara, com intenção de aprendizado do povo que le nossos tópicos.

Sobre o LIKE, sim sim , realmente também não é interessante usá-lo em fomularios de validação, porque aceitam demasiados caracteres e não seria seguro.

Infelizmente não "peguei" a manha de criar posts, e acabo me descuidando ^^.

abraço.