Affichage de données avec Boucle Foreach et button et utilisation d'AJAX Post

**jeremy_Mtl** · 09/05/2016, 19h57

Bonjour à tous, je suis étudiant en programmation et j’utilise depuis peu Ajax.
Actuellement je boss sur un projet avec l'API de Ebay pour chercher des produits et d'afficher les informations par produit dans le but de faire un site de comparatif de prix.

Les produits rechercher par mot sont affichés grâce une boucle foreach.
Chaque produit affiché possède un bouton 'Détails' qui permet d'afficher plus d'information sur le produit.
J'ai donc voulu intégrer un script Ajax pour pouvoir faire appel à une function qui permet d'affiché des détails par id du produit.

Mon problème est que lorsque j'appuis sur le bouton détail, les information s'affiche en dessous de tous les produits et non celui que je veux.
Lorsque je clic bouton détail d'un autre produit, celui ci affiche l'information du produit mais en dessous de tous les autres.
Donc j'arrive et envoyer le id de chaque item dans mon fichier load_data.php, mais j'arrive pas a rendre le div result unique pour chaque produit.

Je pense avoir un problème au niveau des class ou id de mon div result

Est ce que vous pouvez m'éclaircir et m'indiqué où ce trouve mes erreurs, je vous remercie !

Voici le script Javascript dans index.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
<script type="text/javascript">
 
  $('.button').click(function() {
    var item = $(this).closest('tr').find('.item').val();
        //alert(item);
        $.ajax({
        type: 'POST',
        url: 'load_data.php',
        data: { item: item},
        success: function(data) {
            $('.result').html(data);
        }
    });
 
    $('.button').click(function() {
            $('.result').toggle();
 
        });
 
 
    });
</script>

voici ma class_ebay.php ou je fais appel à la function de recherche :

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
<?php 
class Ebay{
 
public function findItemsByKeywords(){
        $apicall   = "http://svcs.ebay.com/services/search/FindingService/v1?";
    $apicall .= "OPERATION-NAME=findItemsByKeywords";
    $apicall .= "&SERVICE-VERSION=1.13.0";
    $apicall .= "&SECURITY-APPNAME=**************";
    $apicall .= "&GLOBAL-ID=EBAY-FRCA";
    $apicall .= '&keywords=iphone';
    $apicall .= '&paginationInput.entriesPerPage=5';
 
    $resp = simplexml_load_file($apicall);
 
    if ($resp->ack == "Success") {
 
      $dataItemId = array();
            foreach($resp->searchResult->item as $item) {
              $dataItemId[] = $item->itemId;
 
                $pic   = $item->galleryURL;
                $link  = $item->viewItemURL;
                $title = $item->title;
                $itemId = $item->itemId;
        $paymentMethod = $item->paymentMethod;
                $categoryName = $item->primaryCategory->categoryName;
                $shipping = $item->shippingInfo->shippingType;
                $shippingCost = $item->shippingInfo->shippingServiceCost;
                $ConvertPrice = $item->sellingStatus->convertedCurrentPrice;
              $sellerRate = $item->sellerInfo->positiveFeedbackPercent;
 
                ?>
 
                  <table class="table table-bordered" id="load_data_table">
                    <tr>
                      <td>Selection</td>
                      <td>Image</td>
                      <td>Titre</td>
                      <td>SellerPercent</td>
                      <td>Prix</td>
                      <td>Action</td>
                    </tr>
 
                    <tr>
                      <td><input type="checkbox" name="" value=""></td> 
 
                      <td><img src=<?php echo $pic ?>></td>
                        <td><a href=<?php echo $link ?>><?php echo $title ?></a></td>
                        <td><?php echo $sellerRate ?>%</td>
                        <td><?php echo $ConvertPrice ?></td>
                        <td>
                        <div class="row">
                              <button type="button" class="button">Details</button>
 
                              <input type="hidden" class="item" value="<?php echo $itemId ?>">
                          </div>
                          </td>
                    </tr>
 
                  </table>
 
                  		<div class="row">
 
                       <div class="result" class="col-md-6"></div> 
                    </div>
				<?php }
                }
} 
}?>

Et enfin le fichier load_data.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
<?php 
$itemId = $_POST['item'];
 
$apicall  = "http://open.api.ebay.com/shopping?";
$apicall .= "callname=GetSingleItem";
$apicall .= "&version=799";
$apicall .= "&appid=*******************";
$apicall .= "&siteid=210";
$apicall .= "&itemid=".$itemId;
$apicall .= "&responseencoding=XML";
$apicall .= "&IncludeSelector=Description,Details,ItemSpecifics,ShippingCosts,TextDescription,Variations,Compatibility";
 
$resp = simplexml_load_file($apicall);
 
$Qte = $resp->Item->Quantity;
$Qtevendu =$resp->Item->QuantitySold;
$dispo = $Qte - $Qtevendu;
$itemId = $resp->Item->ItemID;
 
?>
 
            <table class='table' width='100%'>
				<tr>			
        			<td>Prix Affiché</td>
              		<td>Description</td>
              		<td>Shipping cost</td>
 
        		 </tr>
            	<tr>
            		<td><input type="text" name="" class="form-control" value="<?php echo $resp->Item->ConvertedCurrentPrice ?>"></td>
    				<td><textarea name="" class="form-control" ><?php echo $resp->Item->Description; ?></textarea></td>
    				<td><input type="text" name="" class="form-control" value="<?php echo $resp->Item->ShippingCostSummary->ShippingServiceCost ?>"></td>
            	 </tr>
 
        	</table>
        </div>
 
    </div>
</div>
<?php 
 
 ?>

Invité · 09/05/2016, 21h08

Bonjour,

peut-être :

Code :

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

1
2
3
4
5
6
7
8
 
    $('.button').on('click', function() {
           $('.result').hide(); // on masque tous
// .......
        success: function(data) {
            $(this).closest('.result').html(data); // le plus proche du bouton cliqué
             $(this).closest('.result').show(); // on affiche le plus proche du bouton cliqué
       }

voir : closest()

Invité · 09/05/2016, 21h18

Fais voir... (ton code)

Débogage de base :

mets des alert(...); pour voir ce qui s'affiche

**jeremy_Mtl** · 09/05/2016, 21h27

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
$('.button').on('click',function() {
      $('.result').hide(); // on masque tous
 
    var item = $(this).closest('tr').find('.item').val();
    //var item = $('.itemId').val();
        //alert(item);
        $.ajax({
        type: 'POST',
        url: 'load_data.php',
        data: { item: item},
        success: function(data) {
            $('.result').html(data);
            $('.result').show(data);
 
        }
    });
 
});

Nom : ex1.png
Affichages : 561
Taille : 145,3 Ko

Avec l'alert(item) j'ai bien un retour de chaque itemd Id

Avec l'alert(data) j'ai un retour de 3-4fois du même resultat

Je pense lorsque je click sur le bouton détail l'itemId correspondant au produit est bien envoyé dans load_data.php mais le résultat est retourné dans tous les <div class="result" class="col-md-6"></div> de chaque produit loopé

Faudrai trouver quelques chose pour rendre le <div class="result" class="col-md-6"></div> unique à chaque produit loopé

Affichage de données avec Boucle Foreach et button et utilisation d'AJAX Post

AJAX

Vue hybride

Discussions similaires

Partager

Partager