I really dont know where the hell i am wrong. May be it is simple but I can't figure it out. Any help would be great, please and thank you.
JSON code (it is stored in 'images' column in tblproducts table in the database)
{"200x200":"http://img.fkcdn.com/image/mobile/p/s/u/lenovo-k6-power-k33a42-200x200-imaezt6hypjzhdug.jpeg","400x400":"http://img.fkcdn.com/image/mobile/p/s/u/lenovo-k6-power-k33a42-400x400-imaezt6hypjzhdug.jpeg","800x800":"http://img.fkcdn.com/image/mobile/p/s/u/lenovo-k6-power-k33a42-800x800-imaezt6hypjzhdug.jpeg","unknown":"http://img.fkcdn.com/image/mobile/p/s/u/lenovo-k6-power-k33a42-original-imaezt6hypjzhdug.jpeg"}
HTML & PHP Code:
<?php
$category_id = $_GET['category_id'];
$result = mysql_query("select * from tblproducts where category_id = '$category_id");
while($row = mysql_fetch_array($result, MYSQL_ASSOC)){
?>
<script>
var data =
data.forEach( function(obj) {
var img = new Image();
img.src = obj.Img1;
img.setAttribute("class", "banner-img");
img.setAttribute("alt", "effy");
document.getElementById("img-container").appendChild(img);
});
</script>
<img id="img-container" alt=" " class="img-responsive" />
<h5>
<a target="_blank" href="<?php echo $row['product_url']; ?>">
<?php echo $row['product_title']; ?>
</a>
</h5>
<?php echo $row['maximum_price']; ?>
<?php } ?>
I have no idea about the javascript and how to fetch each of the image from the json and display it in different tag. Please help... Thanks in advance
Assuming your JSON is stored as string in column images. You can do something like this:
// ...
<script>
var data = <?php echo json_decode($row['images']); ?>
Object.keys(data).forEach(function(key) {
var img = new Image();
img.src = data[key];
img.setAttribute("class", "banner-img");
img.setAttribute("alt", "effy");
img.classList.add('img-responsive');
document.getElementById("img-container").appendChild(img);
});
</script>
<div id="img-container"></div>
<h5>
<a target="_blank" href="<?php echo $row['product_url']; ?>">
<?php echo $row['product_title']; ?>
</a>
</h5>
// ...
I've changed the image append logic, what you were doing was wrong. You cannot append images that way, instead create a container and append the newly created images in that container.
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments