[PHP / AJAX]: Alterar a cor da mensagem de acordo com o texto digitado
-
05-07-2019 - |
Pergunta
Na minha página inicial do site, eu tenho um novo formulário de registo do utilizador. Ele contém um campo "Nome de Usuário". Quando o usuário insere o nome de usuário e o foco está apontado para outro campo, um código AJAX é executado que verifica se qualquer usuário com o nome de usuário digitado já existe ou não.
O código AJAX que estou usando é o seguinte:
function toggle_username(userid) {
if (window.XMLHttpRequest) {
http = new XMLHttpRequest();
} else if (window.ActiveXObject) {
http = new ActiveXObject("Microsoft.XMLHTTP");
}
handle = document.getElementById(userid);
var url = 'ajax.php?';
if(handle.value.length > 0) {
var fullurl = url + 'do=check_username_exists&username=' + encodeURIComponent(handle.value);
http.open("GET", fullurl, true);
http.send(null);
http.onreadystatechange = statechange_username;
}
else
{
document.getElementById('username_exists').innerHTML = '';
}
}
O arquivo "ajax.php" chamado pelo código acima, é assim:
<?php
mysql_connect ('localhost', 'MyServer', 'user1');
mysql_select_db('globaldb');
$do = $_GET['do'];
switch($do) {
case 'check_username_exists':
if(get_magic_quotes_gpc()) {
$username = $_GET['username'];
}else{
$username = addslashes($_GET['username']);
}
$count = mysql_num_rows(mysql_query("SELECT * FROM `student_login` WHERE `username`='".$username."'"));
header('Content-Type: text/xml');
header('Pragma: no-cache');
echo '<?xml version="1.0" encoding="UTF-8"?>';
echo '<result>';
if($count > 0) {
$_SESSION['UserExists'] = "true";
}else{
$_SESSION['UserExists'] = "false";
}
$_SESSION['UserExists'] = "false";
echo '</result>';
break;
default:
echo 'Error, invalid action';
break;
}
?>
Na minha ficha de inscrição, logo abaixo da caixa de entrada de nome de usuário, eu quero definir uma seção onde em que eu possa mostrar as mensagens:
Usuário com esse nome existe, ou
Nome de usuário está disponível.
Na minha home page, eu estou usando seguinte código:
<input name="username" type="text" id="username" onchange="toggle_username('username')" style="width:150px;" maxlength="40" size="22" >
<?PHP
if ($_SESSION['UserExists'] == "true")
{
echo "<div id='username_exists' style='font-size: 11px;font-weight: bold;color:red'>User with this name unavailable.</div>";
}
else
{
echo "<div id='username_exists' style='font-size: 11px;font-weight: bold;color:darkgreen'> User with this name is available </div>";
}
?>
A página inicial consiste no código acima e o bloco primeiro código (JavaScript) em cima que eu dei.
Este código não está funcionando. E eu acho que a razão é que eu estou incluíram as mensagens no bloco PHP. Sendo do lado do servidor, ele não está mostrando as mensagens.
Por favor, deixe-me saber como lidar com esta questão. Se modificar o código JavaScript que chama o AJAX ou incluir algo no PHP.
Observe também que o que realmente eu quero é mostrar as mensagens na cor verde ou vermelho. Se o nome de usuário está disponível, em seguida, verde outra na cor vermelha.
Nenhuma solução correta
Outras dicas
Eu faria isso usando jQuery e ter a página PHP retornar um código (0 para falso e 1 para verdadeiro) ou similar. Você pode então usar o método addClass do jQuery () dependendo do resultado retornado, tudo em javascript.
Que tal ter ajax.php devolver um pouco de pré-formatado em HTML e usar a função statechange_username
, que você definiu para processar a resposta, para colocá-lo em um espaço reservado div / span?
A propósito, por que você está definindo uma variável de sessão?
Eu acho que você está perdendo a função statechange_username, algo como
function statechange_username()
{
if (http.readyState==4)
{
document.getElementById(\"username_eixsts\").innerHTML=http.responseText;
}
}