Fonction ajax
j.tel
Messages postés
133
Date d'inscription
Statut
Membre
Dernière intervention
-
PhP Messages postés 1770 Date d'inscription Statut Membre Dernière intervention -
PhP Messages postés 1770 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
je suis informaticien je comprend bien le language php mais je suis debutant en ajax maintenat je cherche la fonction ajax pour tester la diponibilité d'un pseudo ainsi que un cours bien detaillé d'ajax
merci en avance.
je suis informaticien je comprend bien le language php mais je suis debutant en ajax maintenat je cherche la fonction ajax pour tester la diponibilité d'un pseudo ainsi que un cours bien detaillé d'ajax
merci en avance.
A voir également:
- Fonction ajax
- Fonction si et - Guide
- Fonction miroir - Guide
- Fonction moyenne excel - Guide
- Fonction remplacer sur word - Guide
- Fonction somme excel - Guide
2 réponses
Salut,
ben en fait on va creer un fichier javascript comme par exemple ajax.js et on va l'appelle dans le head de la page html (pas besoin de php pour l'instant mais tu peux si t'as envie ^^ )
donc : <script src="ajax.js" type="text/javascript"></script>
Ensuite, on va créer ce fameux fichier js !
ajax.js :
var xmlHttp
function fonction(str, page, id)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Votre navigateur ne supporte pas le HTTP Request")
return
}
var url=page+".php"
url=url+"?q="+str+"&sid="+Math.random()
xmlHttp.onreadystatechange=getStateChanged(id);
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
function getStateChanged(id)
{
if (typeof(id) === 'string')
{
id = document.getElementById(id);
}
return function()
{
if (xmlHttp.readyState==4)
{
id.innerHTML = xmlHttp.responseText;
}
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
Voila !
Donc je t'explique le principe !
La fonction "fonction(str, page,id)" contient 3 paramètres donc 'str' et le contenu envoyé (ici c'est le pseudo qu'on écrit a chauque fois qu'on appuit sur une touche) ! Le paramètre 'page' sera la page (php) appelé côté serveur qui exécutera le code php/mysql pour vérifier si en fonction de 'str' envoyé un pseudo existe déjà a ce nom dans la base de donnée ou non et 'id' sera l'id de l'élément (div par exemple) ou l'on affichera si le pseudo est valide ou non (une image par exemple)
Donc voici un petit exemple de la page html :
index.html
<html>
<head>
<script src="ajax.js" type="text/javascript"></script>
</head>
<body>
Inscription <br /><br />
- Pseudo :<input type="text" id="pseudo" size="20px" onkeyup="fonction(this.value, 'requete', 'resultat')" autocomplete="off"/><div id="resultat"></div>
</body>
</html>
Voila, donc en gros c'est ta page html (basic) ou tu affichera le résultat (dans le <div id="resultat"></div>) si le pseudo est libre ou pas !
Ensuite tu as plus qu'a créer ta page php qui vérifiera si le pseudo est libre (ici on l'appelle dans le deuxième paramètres de la fonction et elle s'appelle 'requete.php')
requete.php
<?php
$q=$_GET["q"];
$con = mysql_connect('localhost', 'root', ''); //Config a changer
if (!$con) // Test de la connexion
{
die('Connexion impossible : ' . mysql_error());
}
mysql_select_db("TA_BASE", $con); //Nom de la base a changer
$sql="SELECT pseudo FROM `users` WHERE `pseudo` LIKE '" . $q . "'"; //Nom de la table et des champs a changer surement
$result = mysql_query($sql);
$ligne = @mysql_num_rows($result);
if ($ligne) //Si on a au moins un résultat suite à la reqûete, c'est que le pseudo n'est pas dispo !
{
echo '<font color=red>Pseudo non disponible</font>';
}
else // sinon il est dispo !
{
echo'<font color=green>Pseudo disponible</font>';
}
?>
Voila, normalement ça devrait marcher, j'ai pas préciser mais j'ai jamais fait ce type de truc mais un semblant (live search) et j'ai pas testé ce code donc dis moi si il y a des bugs ou si ça ne marche pas ! ^^'
Vérifie bien les chemin de images et appelle de fichiers (par défaut, tout est dans le même dossier)
Puis vérifie bien les identifiant de connexions mysql et nom de bases etc....
En espérant t'avoir aider !
A+
Gaerebut
ben en fait on va creer un fichier javascript comme par exemple ajax.js et on va l'appelle dans le head de la page html (pas besoin de php pour l'instant mais tu peux si t'as envie ^^ )
donc : <script src="ajax.js" type="text/javascript"></script>
Ensuite, on va créer ce fameux fichier js !
ajax.js :
var xmlHttp
function fonction(str, page, id)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Votre navigateur ne supporte pas le HTTP Request")
return
}
var url=page+".php"
url=url+"?q="+str+"&sid="+Math.random()
xmlHttp.onreadystatechange=getStateChanged(id);
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
function getStateChanged(id)
{
if (typeof(id) === 'string')
{
id = document.getElementById(id);
}
return function()
{
if (xmlHttp.readyState==4)
{
id.innerHTML = xmlHttp.responseText;
}
}
}
function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
Voila !
Donc je t'explique le principe !
La fonction "fonction(str, page,id)" contient 3 paramètres donc 'str' et le contenu envoyé (ici c'est le pseudo qu'on écrit a chauque fois qu'on appuit sur une touche) ! Le paramètre 'page' sera la page (php) appelé côté serveur qui exécutera le code php/mysql pour vérifier si en fonction de 'str' envoyé un pseudo existe déjà a ce nom dans la base de donnée ou non et 'id' sera l'id de l'élément (div par exemple) ou l'on affichera si le pseudo est valide ou non (une image par exemple)
Donc voici un petit exemple de la page html :
index.html
<html>
<head>
<script src="ajax.js" type="text/javascript"></script>
</head>
<body>
Inscription <br /><br />
- Pseudo :<input type="text" id="pseudo" size="20px" onkeyup="fonction(this.value, 'requete', 'resultat')" autocomplete="off"/><div id="resultat"></div>
</body>
</html>
Voila, donc en gros c'est ta page html (basic) ou tu affichera le résultat (dans le <div id="resultat"></div>) si le pseudo est libre ou pas !
Ensuite tu as plus qu'a créer ta page php qui vérifiera si le pseudo est libre (ici on l'appelle dans le deuxième paramètres de la fonction et elle s'appelle 'requete.php')
requete.php
<?php
$q=$_GET["q"];
$con = mysql_connect('localhost', 'root', ''); //Config a changer
if (!$con) // Test de la connexion
{
die('Connexion impossible : ' . mysql_error());
}
mysql_select_db("TA_BASE", $con); //Nom de la base a changer
$sql="SELECT pseudo FROM `users` WHERE `pseudo` LIKE '" . $q . "'"; //Nom de la table et des champs a changer surement
$result = mysql_query($sql);
$ligne = @mysql_num_rows($result);
if ($ligne) //Si on a au moins un résultat suite à la reqûete, c'est que le pseudo n'est pas dispo !
{
echo '<font color=red>Pseudo non disponible</font>';
}
else // sinon il est dispo !
{
echo'<font color=green>Pseudo disponible</font>';
}
?>
Voila, normalement ça devrait marcher, j'ai pas préciser mais j'ai jamais fait ce type de truc mais un semblant (live search) et j'ai pas testé ce code donc dis moi si il y a des bugs ou si ça ne marche pas ! ^^'
Vérifie bien les chemin de images et appelle de fichiers (par défaut, tout est dans le même dossier)
Puis vérifie bien les identifiant de connexions mysql et nom de bases etc....
En espérant t'avoir aider !
A+
Gaerebut
Bjr
Ben sur Google on trouve facilement :
https://www.xul.fr/xml-ajax.html
https://ajax.developpez.com/
http://www.w3schools.com/Ajax/Default.Asp
etc
Après une fois que tu sais comment ça marche tu peux choisir d'utiliser un framework comme prototype par ex
Ben sur Google on trouve facilement :
https://www.xul.fr/xml-ajax.html
https://ajax.developpez.com/
http://www.w3schools.com/Ajax/Default.Asp
etc
Après une fois que tu sais comment ça marche tu peux choisir d'utiliser un framework comme prototype par ex
