Iterate through JSON based on ID

Question

I am working on a webshop template and I need to display the correct JSON data according to every single product in the store in a modal that opens when clicking the given product. I am also using handlebars for templating and have the following code structure:

.html (button to open the modal)

<button type="button" class="quickview">Open Modal</button>

.html (modal)

<div id="quickview-modal">
 modal content that should iterate over the JSON and display one item at a time depending on the ID 
</div>

.json

{
 "productID" : "1",
 "name" : "productOne"
},
{
 "productID" : "2",
 "name" : "productTwo"
}

.js

$( ".quickview" ).click(function( event ) {
  $('#quickview-modal').modal('show');
  event.stopPropagation();
  // Do something
});

Any ideas how I can tackle this? Thanks!

Answer 1

say your .json variable is data

 var data = 'your JSON';
 $.each(data,function(i,v){
     alert(v.productID); //will give you the value related to productID.
 });

updated

$( ".quickview" ).click(function( event ) {
   event.stopPropagation();
   var data = 'your JSON';
   $.each(data,function(i,v){
      $('#quickview-modal').append(v.name + " : " + v.productID);

   });
   $('#quickview-modal').modal('show');
 });