[AJAX] Combiner des fonctions Ajax

**isitien** · 17/01/2011, 05h48

Bonjour,

J'ai lu le tuto ici en utilisant la fonction showUser, son role est de rafraichir la page cible sans rafraichir le navigateur, supposons que j'ai 2 <select> sur la meme page, est ce qu'il est possible de combiner la meme fonction au lieu de creer une autre? par exemple:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<script type="text/javascript">
function showUser(str)
{
 
// reste du code
 
xmlhttp.open("GET","getuser.php?q="+str,true);
 
}
</script>

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<script type="text/javascript">
function Clicks(str)
{
 
// reste du code
 
xmlhttp.open("GET","fichier.php?id="+str,true);
 
}
</script>

Je trouve que c'est embettant d'avoir repete la meme fonction que pour changer son nom ainsi que l'url (la cible).

Merci

**andry.aime** · 17/01/2011, 06h37

Bonjour,

supposons que j'ai 2 <select> sur la meme page, est ce qu'il est possible de combiner la meme fonction au lieu de creer une autre?

En mettant en paramètre l'URL, le div à mettre à jour et la variable a envoyé.

A+.

**isitien** · 17/01/2011, 06h55

Envoyé par andry.aime

Bonjour,

En mettant en paramètre l'URL, le div à mettre à jour et la variable a envoyé.

A+.

J'ai pas bien compris, j'ai donne l'exemple par select seulement, ça peut être quelque chose d'autres, par exemple

Code html :

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

<a href="#">lien</a>

**andry.aime** · 17/01/2011, 16h25

quelque chose du genre

Code html :

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

1
2
<a href="#" onclick="ajax('page.php?var1=kikou','div1')">mettre a jour div 1</a>
<div id="div1"></div>

Code :

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

1
2
3
4
5
6
7
8
9
10
11
function ajax(page,divAMettreAJour){
...
xmlhttp.onreadystatechange=function{
 
.....
document.getElementById(divAMettreAJour).innerHTML=xmlhttp.response.Text;
 
}
xmlhttp.open("GET",page,true);
...
}

**isitien** · 18/01/2011, 02h35

Donc le code serait comme suite:

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
 
function ajax(page,divAMettreAJour){
{
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById(divAMettreAJour).innerHTML=xmlhttp.response.Text;
    }
  }
xmlhttp.open("GET",page,true);
xmlhttp.send();
}

Code :

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

1
2
3
4
5
6
 
<a href="#" onclick="ajax('page.php?var1=kikou','div1')">mettre a jour div 1</a>
<div id="div1"></div>
 
<a href="#" onclick="ajax('page.php?var=quelque_chose','div2')">mettre a jour div 2</a>
<div id="div2"></div>

Une question si ca vous derange pas, "page" etant que variable ou bien le nom de page, par exemple:

Code :

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

1
2
 
xmlhttp.open("GET",page,true);

Code :

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

1
2
3
 
<a href="#" onclick="ajax('une_page_kouki.php?var=kikou','div1')">mettre a jour div 1</a>
<div id="div1"></div>

Merci

**andry.aime** · 18/01/2011, 03h48

Envoyé par isitien

Code :

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

1
2
3
4
5
if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }

Envoyé par isitien

Une question si ca vous derange pas, "page" etant que variable ou bien le nom de page, par exemple:

Il va falloir que tu regardes la notion de programmation

.

A+.

**isitien** · 18/01/2011, 05h27

Envoyé par andry.aime

Il va falloir que tu regardes la notion de programmation

.

A+.

J'ai oublie de la changer:

Code :

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

1
2
 
document.getElementById(divAMettreAJour).innerHTML=xmlhttp.response.Text;

**andry.aime** · 18/01/2011, 12h21

Code :

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

document.getElementById(divAMettreAJour).innerHTML=xmlhttp.responseText;

Désolé pour l'étourderie

.

**isitien** · 19/01/2011, 02h47

Envoyé par andry.aime

Code :

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

document.getElementById(divAMettreAJour).innerHTML=xmlhttp.responseText;

Désolé pour l'étourderie

.

voila mon code final s'il y a quelque chose a changer:

entre les balises head:

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
 
<script type="text/javascript">
function ajax(page,divAMettreAJour){
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById(divAMettreAJour).innerHTML=xmlhttp.response.Text;
    }
  }
xmlhttp.open("GET",page,true);
xmlhttp.send();
}
</script>

Code :

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

1
2
 
echo '[ <a href="#" onclick="ajax(\'page.php?thumbsu=up&idc="'.$idc.'"\',\'div1\')" class="Link02"><img src="'.$path2icons.'thumbs_up.png" align="absmiddle" class="Img02"></a><font color="#00FF00"><span id="div1">'.$thumbsu.'</span></font> ]';

et page.php:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
$thumbsu = $_GET['thumbsu'];
echo $thumbsu.'<br>';
 
$idc = $_GET['idc'];
echo $idc.'<br>';
 
$increment = $thumbsu + 1; 
 
$update = 'UPDATE comments SET thumbsu = "'.$increment.'" WHERE idc = "'.$idc.'"';
$query = mysql_query($update) OR DIE (mysql_error());

**andry.aime** · 19/01/2011, 04h30

responseText mais pas response.Text

**isitien** · 19/01/2011, 05h14

Envoyé par andry.aime

responseText mais pas response.Text

Y a t il un code a ajouter afin de verifier si les donnees se sont transmises a page.php? ou bien que page.php existe?

**andry.aime** · 19/01/2011, 06h21

Re,

Nous sommes sur le forum AJAX, le code HTML généré est appréciable que le code PHP, montre nous le code HTML généré mais pas le php, c'est plus facile à debuguer. Car, je pense que la chaine généré est tronqué à cet endroit.

echo '[ <a href="#" onclick="ajax(\'page.php?thumbsu=up&idc="'.$idc.'"\',\'div1\')" class="Link02"><img src="'.$path2icons.'thumbs_up.png" align="absmiddle" class="Img02"></a><font color="#00FF00"><span id="div1">'.$thumbsu.'</span></font> ]';

Code php :

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

echo '[ <a href="#" onclick="ajax(\'page.php?thumbsu=up&idc='.$idc.'\',\'div1\')" class="Link02"><img src="'.$path2icons.'thumbs_up.png" align="absmiddle" class="Img02"></a><font color="#00FF00"><span id="div1">'.$thumbsu.'</span></font> ]';

A+.

**isitien** · 19/01/2011, 10h24

voila le code de la page 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
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
 
<?php
$menu = $_GET['menu'];
 
$select_com = 'SELECT * from comments WHERE idcat = 4 AND id_cl = "'.$menu.'"';
$result_com = mysql_query ($select_com) or die ('Erreur de selection de commentaires: ' .mysql_error());
$total_com = mysql_num_rows($result_com);
 
        echo 'total: '.$total_com;
        echo '<br>';
 
 
if($total_com) {  
    
                while ($row_com = mysql_fetch_array($result_com))
        {  
       extract($row_com);
           
       
       for ($i = 1; $i <= $total_com; $i++)
    {
        //echo '<b>'.$i.'</b><br>';
        
        $msg_num = '<a href="'.$rub.'-'.$srub.'-'.$cat.'-'.$scat.'-play'.$menu.'.html#'.$idc.'">'.$i.' #</a>';
    }
 
$select_nick = 'SELECT * from members WHERE idm = "'.$id_pseudo.'"';
$result_nick = mysql_query ($select_nick) or die ('Erreur de selection de commentaires: ' .mysql_error());
$row_nick = mysql_fetch_array($result_nick);
 
extract($row_nick);
 
    $country_code = $country;
        
        $select_cou = "SELECT * FROM countries WHERE code='$country_code'";
        $result_cou = mysql_query ($select_cou) or die ('Erreur de selection des pays: ' .mysql_error());
        $row_cou = mysql_fetch_array($result_cou);
                
        $country = $row_cou['country'];
        $code = $row_cou['code'];
 
                        $color = ($total_com % 2) ? $bgcolor1 : $bgcolor2 ;
 
     
                        
                $number = array (1, 2);
                $picture_en = array('male', 'female');
                        
                
                $gender_en = str_replace ($number, $picture_en, $gender);
                $date_posted = date('Y-m-d', $date_posted);
        $time_posted = date('G:i:s', $date_posted);
                
                //echo '<a name="'.$idc.'">';
                echo '<table width="600" border="0" cellpadding="0">';
                echo '<tr bgcolor="#e0dace">';
        echo '<td width="200" align="right">';
        echo $msg_num;
        echo '&nbsp;&nbsp;';
        
        echo '[ <a href="#" onclick="ajax(\'page.php?thumbsu=up&idc='.$idc.'\',\'div1\')" class="Link02"><img src="'.$path2icons.'thumbs_up.png" align="absmiddle" class="Img02"></a><font color="#00FF00"><span id="div1">'.$thumbsu.'</span></font> ]';
        
        echo '&nbsp;&nbsp;';
        
        echo '<img src="'.$path2flags.'Shadow/'.$code.'.png" title="'.$country.'" align="absmiddle">';
        
        echo '&nbsp;&nbsp;';
        
        echo '<img src="'.$path2icons.$gender_en.'.png" title="'.$gender_en.'" align="absmiddle" class="Img02">';
        echo '&nbsp;';
        echo $pseudo;
 
        echo '</td></tr>';
        echo '</table>';
   $total_com++;
 
        }
        
        echo '<hr width="400">';
 
                                
}
                                else
                                {
                                        echo 'Aucun commentaire';
                                }               
 
 
?>

le code JS:

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
 
<script type="text/javascript">
function ajax(page,divAMettreAJour){
{
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById(divAMettreAJour).innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET",page,true);
xmlhttp.send();
}
}
</script>

et le code page.php:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<?php
$thumbsu = $_GET['thumbsu'];
echo $thumbsu.'<br>';
 
$idc = $_GET['idc'];
echo $idc.'<br>';
 
$increment = $thumbsu + 1; 
 
$update = 'UPDATE comments SET thumbsu = "'.$increment.'" WHERE idc = "'.$idc.'"';
$query = mysql_query($update) OR DIE (mysql_error());
?>

Sachant que les pages sont de cette hieararchie:

index.php
rep1/rep2/page.php
rep1/rep2/index.php

A++

**andry.aime** · 19/01/2011, 11h50

On a demandé le code HTML généré mais pas le code PHP qui génère la page

**isitien** · 20/01/2011, 09h24

Envoyé par andry.aime

On a demandé le code HTML généré mais pas le code PHP qui génère la page

andry.aime: Je vous ai ennerve un peu, mais je n'ai que ces 3 pages, avec du code:

Code :

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

1
2
3
4
5
 
<html>
<head>
..
</html>

Je vous ai pas bien compris de quel code HTML parlez vous.

**isitien** · 21/01/2011, 06h25

Le code source HTML est:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
total comments: 3<br>
<table width="600" border="0" cellpadding="0"><tr bgcolor="#e0dace">
<td width="200" align="right">&nbsp;&nbsp;
<img src="Mes_Images/Flags/Shadow/be.png" title="Belgique" align="absmiddle">&nbsp;&nbsp;
<img src="Mes_Images/Icones/male.png" title="male" align="absmiddle" class="Img02">&nbsp;
Admin</td><td align="center">
<img src="Mes_Images/Icones/calendar.png" align="absmiddle" class="Img02"> 
2011-01-11&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<img src="Mes_Images/Icones/clock.png" align="absmiddle" class="Img02"> 
1:33:31</td><td width="150" align="center">
[ <a href="#" onclick="ajax('page.php?thumbsu=up&idc=1','div1')" class="Link02"><img src="Mes_Images/Icones/thumbs_up.png" align="absmiddle" class="Img02"></a><font color="#00FF00"><span id="div1">0</span></font> ]

**isitien** · 21/01/2011, 15h58

Ca marche maintenant pour la premiere div, mais quand je clique il y a l'update de la table, mais le chiffre n'apparaissait pas sur le champs, que lorsque je fais un rafraichissement de page.

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
 
mysql_select_db($db_general) or die ('Erreur de selection de la BD general: '.mysql_error());
$select_com = 'SELECT * from comments WHERE idcat = 4 AND id_cl = "'.$menu.'"';
$result_com = mysql_query ($select_com) or die ('Erreur de selection de commentaires: ' .mysql_error());
$total_com = mysql_num_rows($result_com);
 
while ($row_com = mysql_fetch_assoc($result_com))
	{  
       extract($row_com);
 
echo '[ <a href="#" onclick="ajax(\'page.php?thumbsu=up&number='.$thumbsu.'&idc='.$idc.'\',\'div1\')" class="Link02"><img src="'.$path2icons.'thumbs_up.png" align="absmiddle" class="Img02"></a><font color="#00FF00"><span id="div1">'.$thumbsu.'</span></font> ]';
 
//..
 
}

**isitien** · 22/01/2011, 07h35

C'est bien, ca marche, j'ai ajoute la requete sur page.php afin de recuperer les donnees de la table, juste un petit ajout, quand je clique sur le lien, la page monte vers le haut, comme si on clique sur <a href=# target=top>, je dois descendre avec les barres de defilement afin de voir l'incrementation du compteur, comme par exemple ici

voila le code du lien cliquable:

Code :

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

1
2
 
echo '[ <a href="#" onclick="ajax(\'page.php?thumbs=up&number='.$thumbsu.'&idc='.$idc.'&menu='.$menu.'\',\'div1\')" class="Link02"><img src="'.$path2icons.'thumbs_up.png" align="absmiddle" class="Img02"></a><font color="#00FF00"><span id="div1">'.$thumbsu.'</span></font> ]';

**isitien** · 22/01/2011, 11h06

J'ai rencontre un autre probleme:

voila le code de page.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
 
<?php
if ($thumbs == 'up')
{
        $update = 'INSERT INTO thumbs VALUES ("", "'.$idcom.'", "'.$idpseudo.'", "1", "0","'.$ip_visiteur.'", "'.$DateTime.'")';
}
if ($thumbs == 'down')
{
        $update = 'INSERT INTO thumbs VALUES ("", "'.$idcom.'", "'.$idpseudo.'", "0", "1","'.$ip_visiteur.'", "'.$DateTime.'")';
}
 
$query = mysql_query($update) OR DIE (mysql_error());
 
 
$select_com = 'SELECT count(*) FROM thumbs WHERE idcom= "'.$idcom.'"';
//echo $select_com.'<br>';
$result_com = mysql_query ($select_com) or die ('Erreur de selection de commentaires: ' .mysql_error());
$datas = mysql_fetch_array($result_com);
echo $datas[0];  
?>

**isitien** · 22/01/2011, 11h08

c'est le cas de ce forum, en bas de mon post il y a "up" et "down", quand je clique sur un commentaire pour le noter, il fait la mise a jour du meme post sur la BD mais il affiche l'incrementation du premier post

[AJAX] Combiner des fonctions Ajax

AJAX

Discussions similaires

Partager

Partager