[AJAX] Actualiser seulement une partie de la page
Bonsoir
J'ai besion de votre aide svp.
Je voudrais realiser une page web visant a chercher des produits identifiés par(espece, variete categorie).
Pour cela je voudrais que lorsque j'ai selectioné un produit que je veux chercher, seulement la partie qui contient les informations sur les produits (<div id="p_chercher"> <div>) qui soit actualisée(refrecher) et pas toute la page.
Voici le code de la page principale:
Code:
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
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
| <html>
<script type="text/javascript" src="javascript/jsrefreche.js"></script>
<body onload="refresh_div()" >
<div id="global">
<?php include("includes/header.php"); ?>
<div id="center-homeC">
<form method="post" action="chercher_produit.php">
<fieldset>
<legend id="formtitre">Chercher produits</legend><br><br>
<table>
<tr>
<td class="tdtext"> <label for="espece"> Espece : </label></td>
<td> <select name="espece" id="espece">
<?php
try{
$bdd=new PDO('mysql:host=localhost;dbname=dpa', 'root', '');
}
catch(Exception $e){
die('ereur :'. $e->getMessage());
}
$reponse=$bdd->query('select idespece from espece');
while ($donnees = $reponse->fetch())
{
?>
<option value=<?php echo $donnees['idespece']; ?>> <?php echo $donnees['idespece']; ?></option>
<?php
}
$reponse->closeCursor();
?>
</select></td>
</tr>
<tr><td> </td><td> </td></tr>
<tr>
<td class="tdtext"><label for="variete"> Variete : </label></td>
<td><select name="variete" id="variete">
<?php
try{
$bdd=new PDO('mysql:host=localhost;dbname=dpa', 'root', '');
}
catch(Exception $e){
die('ereur :'. $e->getMessage());
}
$reponse=$bdd->query('select idvariete from variete');
while ($donnees = $reponse->fetch())
{
?>
<option value=<?php echo $donnees['idvariete']; ?>> <?php echo $donnees['idvariete']; ?></option>
<?php
}
$reponse->closeCursor();
?>
</select></td>
</tr>
<tr><td> </td><td> </td></tr>
<tr>
<td class="tdtext"><label for="categorie"> Categorie : </label></td>
<td><select name="categorie" id="categorie">
<?php
try{
$bdd=new PDO('mysql:host=localhost;dbname=dpa', 'root', '');
}
catch(Exception $e){
die('ereur :'. $e->getMessage());
}
$reponse=$bdd->query('select idcat from categorie');
while ($donnees = $reponse->fetch())
{
?>
<option value=<?php echo $donnees['idcat']; ?>> <?php echo $donnees['idcat']; ?></option>
<?php
}
$reponse->closeCursor();
?>
</select></td></tr>
</table>
</p>
</fieldset>
<p>
<input type="submit" value="Chercher" style="background-color: rgb(207, 106, 5); color: white; font: 10pt bold verdana; height: 34px;"/>
</p>
</form>
<div id="p_chercher">
<?php
try{
$bdd=new PDO('mysql:host=localhost;dbname=dpa', 'root', '');
}
catch(Exception $e){
die('ereur :'. $e->getMessage());
}
$reponse=$bdd->prepare('select * from produit where idespece=? and idvariete=? and idcat=? ');
$reponse->execute(array( $_POST['espece'], $_POST['variete'], $_POST['categorie'])) or die(print_r($bdd->errorInfo()));
while ($donnees = $reponse->fetch())
{
?>
<strong>Espece: </strong><?php echo $donnees['idespece']; ?><br/><br>
<strong>variete: </strong><?php echo $donnees['idvariete']; ?><br/><br>
<strong>categorie: </strong><?php echo $donnees['idcat']; ?><br/><br>
<strong>Prix de vente: </strong><?php echo $donnees['prixvente']; ?><br><br>
<strong>quantité de stock: </strong><?php echo $donnees['stock']; ?><br>
<?php
}
$reponse->closeCursor();
?>
</div>
</div>
</div>
<?php include("includes/footer.php"); ?>
</div>
</body>
</html> |
Et voici le code ajax:
Code:
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
| <script>
var sText = '';
function refresh_div()
{
var xhr_object = null;
if(window.XMLHttpRequest)
{ // Firefox
xhr_object = new XMLHttpRequest();
}
else if(window.ActiveXObject)
{ // Internet Explorer
xhr_object = new ActiveXObject('Microsoft.XMLHTTP');
}
var method = 'POST';
var filename = 'chercher_produit.php';
xhr_object.open(method, filename, true);
xhr_object.onreadystatechange = function()
{
if(xhr_object.readyState == 4)
{
var tmp = xhr_object.responseText;
if(xhr_object.responseText != sText) {
document.getElementById('p_chercher').innerHTML = sText = xhr_object.responseText;}
}
}
xhr_object.send(null);
setTimeout('refresh_div()', 5000);
}
</script> |
Merci de m'aider.
