Render Images from Data Sources - Bracket Notation
See original GitHub issueChallenge Render Images from Data Sources has an issue.
User Agent is: Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36
.
Please describe how to reproduce this issue, and include links to screenshots if possible.
My code:
<script>
$(document).ready(function() {
$("#getMessage").on("click", function() {
$.getJSON("/json/cats.json", function(json) {
var html = "";
json.forEach(function(val) {
html += "<div class = 'cat'>";
// Only change code below this line.
html += "<img src = '" + val["imageLink"] + "'>";
// Only change code above this line.
html += "</div>";
});
$(".message").html(html);
});
});
});
</script>
<div class="container-fluid">
<div class = "row text-center">
<h2>Cat Photo Finder</h2>
</div>
<div class = "row text-center">
<div class = "col-xs-12 well message">
The message will go here
</div>
</div>
<div class = "row text-center">
<div class = "col-xs-12">
<button id = "getMessage" class = "btn btn-primary">
Get Message
</button>
</div>
</div>
</div>
Forgive me if I don’t know the correct terms. Bracket notation (val[“imageLink]”) not accepted as a correct solution even though clicking Get Message does the same thing with Dot Notation (val.imageLink).
Issue Analytics
- State:
- Created 7 years ago
- Comments:7 (6 by maintainers)
Top Results From Across the Web
7 - Render Images from Data Sources - JSON APIs and AJAX
We look at rendering the images from our API Data. We create an image tag for each picture, extracting and assigning the source...
Read more >JSON treatment exercise - JavaScript
In this exercise, why can't I use bracket notation to pass the key ? json.forEach(function(val) { html += ... Challenge: Render Images from...
Read more >Render and export still images and still-image sequences
The name that you specify must contain pound signs surrounded by square brackets ([#####]). As each frame is rendered and a filename created...
Read more >JavaScript object basics - Learn web development | MDN
An object is a collection of related data and/or functionality. ... Bracket notation provides an alternative way to access object properties ...
Read more >How do I display local image in markdown?
To add an image in markdown file the .md file and the image should be in the same directory. ... if image has...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@dhcodes @raisedadead I’d like to give this a shot!
This is an issue with the test
As @ajain17 points out
val[imageLink]
does work, but only as a side effect of not escaping the.
in the Regex test, thereby letting any value replace the[
. The test needs to be re-written to strictly search for dot notation and also allow bracket notation with required quotes as in:val["imageLink"]
.