Fonction ajax
Fermé
j.tel
Messages postés
133
Date d'inscription
mercredi 14 mai 2008
Statut
Membre
Dernière intervention
13 mai 2013
-
7 août 2008 à 10:40
PhP Messages postés 1770 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 - 7 août 2008 à 11:40
PhP Messages postés 1770 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 - 7 août 2008 à 11:40
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 moyenne excel - Guide
- Fonction miroir - Guide
- Fonction somme excel - Guide
- Fonction remplacer word - Guide
2 réponses
gaerebut
Messages postés
1017
Date d'inscription
mardi 30 octobre 2007
Statut
Membre
Dernière intervention
22 novembre 2013
171
7 août 2008 à 11:22
7 août 2008 à 11:22
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
PhP
Messages postés
1770
Date d'inscription
lundi 11 décembre 2000
Statut
Membre
Dernière intervention
23 décembre 2009
606
7 août 2008 à 11:40
7 août 2008 à 11:40
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
