CODEWITHSUNDEEP
javascriptphpjquery
eklundkristoffer
eklundkristoffer

Reputation: 19

jQuery, foreach loop gives me same output on both values

Ok, now i have a new problem with this jQuery script. In my foreach loop, i fetch out the product name and so on. The thing is, i have 2 different products with 2 different descriptions. But this code: 

<div class="wiki-content">
    <div class="box9">
        <h1>Sample Box</h1>   
        <img src="http://www.wpthemegenerator.com/wp-content/uploads/2012/06/Image.jpg">

        <?php
            echo $getTheOffer['wiki_text'];
        ?>
        <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam luctus consectetur dolor a porttitor. Curabitur id sem sed ante fringilla pulvinar et id lectus. Nullam justo ipsum, hendrerit ut commodo nec, pellentesque nec erat. Pellentesque pharetra.</p><br/>
 </div>
</div>

and this jQuery:

;(function($) {
// DOM Ready
$(function() {
    // Binding a click event
    // From jQuery v.1.7.0 use .on() instead of .bind()
    $('.wiki-button').bind('click', function(e) {
        // Prevents the default action to be triggered. 
        e.preventDefault();
        // Triggering bPopup when click event is fired
        $('.wiki-content').bPopup();
    });
});
})(jQuery);

Gives me same output on both. I gonna mention that it is popup dialog windows, when i try put this on a other row. Not inside this popup it works just fine. Thanks for any help! :)

EDIT,

I change the popup windows from class to id and now it shows the 2 different texts. But not right. product nr 2 shows product nr 1s text. and product nr 2 shows product nr 1s text.

Upvotes: 0

Views: 83

Answers (1)

Neil
Neil

Reputation: 872

You have to specify which .wiki-content you want to display depending on the button that you click. If the buttons and the contents are in table rows, you could do something like this

$('.wiki-button').bind('click', function(e){
  var $tr = $(e.currentTarget).closest('tr'), 
      $content = $tr.find('.wiki-content');

  $content.bPopup();
});

This will find the content that lives in the same row.

Upvotes: 1

Related Questions