CODEWITHSUNDEEP
javascriptdjango
Space guy
Space guy

Reputation: 415

How to get in Javascript specific Object of iteration done in a Django template

I have the next iteration in a Django template. This shows me a group of images and their title.

    {% for i in blogs %}
        <div class="content__blog">
            <h4 class="content__blog__h4">{{i.title}}</h4>
            <img class="content__blog__img" src="{{i.image.url}}" onclick="clickImage()">
        </div>
    {% endfor %}

What i want to do by adding JavaScript is that when clicking on an Image it'll resize. But only the image clicked. How do i specify in the JS file which image i'm clicking on?

Upvotes: 0

Views: 29

Answers (1)

rahul.m
rahul.m

Reputation: 5854

try something like this

{% for i in blogs %}
    <div class="content__blog">
         <h4 class="content__blog__h4">{{i.title}}</h4>
         <img class="content__blog__img" id="{{i.id}}" src="{{i.image.url}}" onclick="clickImage(this)">
     </div>
{% endfor %}

js

function clickImage(e){
   // e is image element
   alert(e.id)
}

Upvotes: 1

Related Questions