question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Render Images from Data Sources - Bracket Notation

See original GitHub issue

Challenge 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:closed
  • Created 7 years ago
  • Comments:7 (6 by maintainers)

github_iconTop GitHub Comments

3reactions
Manish-Giricommented, Dec 14, 2016

@dhcodes @raisedadead I’d like to give this a shot!

3reactions
dhcodescommented, Dec 14, 2016

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"].

Read more comments on GitHub >

github_iconTop 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 >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found