Discussion :

[toulousain3117]

Bonjour, j'ai pas mal fait de recherche sur google et même sur ce forum et bien d'autres, mais je n'arrive pas a trouver la solution adéquate pour le script que je desire réalisé .

J'ai un formulaire avec les champs email et mot de passe , et un fichier php qui me permet de recuperer les informations de mon formulaire pour ensuite connecter une session en php

Jusqu'a la pas de probleme etand donnée que en PHP la connection se realise correctement !

Mais je souhaiterai que ma connection en php se fasse via javascript sur une seul div

que avant ça me mette le formulaire avec les champs et a la validation un petit text Connection en cours .... et ensuite se realise la requete sur mon fichier php pour realisé l'authentification !

Comment puis je faire pour que la connection de fasse avec Javascripts sans que toute la page se charge

Cordialement

[Invité]

Bonjour,
Tu as eu raison de poster ici, car c'est 100% le rôle d'Ajax.
En fait il te suffis de passer par ton XMLHttpRequest les deux données en methode POST.
XMLHttpRequest va donc appeler un PHP de controle/validation du login,
il répondra par un simple echo "tout ce que tu veux en html";
cette réponse tu l'envoie dans ton DIV

[toulousain3117]

mais je doit presenter le code comment avec XMLHttpRequest car déjà que j'ai mit 2 ans pour reussir a faire un refresh d'une div en ajax lol

c'est dans le même genre que ce code ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
function chargeFichier() {
    var XHR = new XHRConnection();        
    XHR.setRefreshArea('nomdudiv');
    XHR.sendAndLoad("nomdufichierarefrresh", "GET");
    return true;
 
}

Merci tout de même de ta réponse

[Invité]

OK alors un exemple basique qui peut te servir a tout !
deux PHP
ajax_apprendre.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
 
<SCRIPT language=JavaScript>
function maFonctionAjax(lindex, pseudo)
{
  var MonAjax;
  if (window.XMLHttpRequest) MonAjax = new XMLHttpRequest();
  else if (window.ActiveXObject) MonAjax = new ActiveXObject('Microsoft.XMLHTTP'); 
  MonAjax.open('POST',"ajax_apprendre_sql.php",true);
/*
3: réponse en cours.
4: terminé. 
*/
  MonAjax.onreadystatechange = function()
  {
      if (MonAjax.readyState == 4 && MonAjax.status==200)
      {
          if (document.getElementById) 
          {    
              if (MonAjax.responseText =='true') { 
                    document.getElementById('LeRetour').innerHTML='<font color=GREEN>'+MonAjax.responseText+'</font>';
              }else{                             
                    document.getElementById('LeRetour').innerHTML='<font color=RED>'+MonAjax.responseText+'</font>';
              }
          }     
      }
  }
  MonAjax.setRequestHeader('Content-type','application/x-www-form-urlencoded');
  MonAjax.send('lindex='+lindex+'&pseudo='+pseudo);                  
}
</SCRIPT>
<div class='centre0'>
<br /><br /><br /><br /><br /><br />
<form method="post" onsubmit="maFonctionAjax(this.lindex.value,this.pseudo.value);return false" action="">
L' index    <input name="lindex" id="lindex" type="text"><br />
Le pseudo:  <input name="pseudo" id="pseudo" type="text"><br />
<br /><br />
<input type="submit" value="envoyer"  /><br />
</form>
 
</div>
<div id="LeRetour"></div>
</body></html>

ajax_apprendre_sql.php qui est celui qui travail et fait
tout ce que tu veux, requete sql etc ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<?PHP
$lindex = (isset($_POST['lindex'])) ? (int) $_POST['lindex'] : 9999;
$pseudo = (isset($_POST['pseudo'])) ? $_POST['pseudo'] : '';
if($pseudo!="" && $lindex!=9999){
    echo "true";
    //===== toute action echo html SQL etc...
}
else
{
    echo "le data ".$pseudo."n est pas valide";
}
?>

A toi de jouer

JE REEDITES, car je voulais te mettre en garde contre le risque d'incompatibilitée. Mon exemple est un bon model, mais il te faut quand tu l'auras compris, y ajouter les deux contrôles entre IE et FF puis sur Ajax lui même.
Regardes la réponse sur ce sujet d' Audry.aime
Controle Ajax

[toulousain3117]

merci beaucoup de ton aide, je vais tester et je te tiens au courant

mais lindex cela signifie quoi ?

[andry.aime]

Bonsoir,

mais lindex cela signifie quoi ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
var lindex= document.getElementById('lindex').value;
var pseudo= document.getElementById('pseudo').value;
MonAjax.send('lindex='+lindex+'&pseudo='+pseudo);

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

L' index    <input name="lindex" id="lindex" type="text"/><br />

Il faut fermer la balise input.

A+.