</tr>
      {% for row in data_all %}
      <tr>
        <td>{{ row.1 }}</td>
        <td>{{ row.2 }}</td>
        <td>
            {% load static %}
            <img class="img-resizable" src="{% static row.3 %}" alt="{{ row.3 }}" width="150" height="100" align="centre"
                 onclick="imgsize();" />
        </td>
      </tr>
      {% endfor %}
  </table>
</div>

<style>
    .img-resizable {
    cursor: pointer;
    }

    .img-resizable-zoomed {
    zoom: 2.0
    }
</style>

<script language="javscript">
    var clickableImages = document.getElementsByClassName("img-resizable")

    for (image in clickableImages) {
        clickableImages[image].addEventListner("click", function (event) {
            event.target.classList.toggle("img-resizable-zoomed")
        })
    }
</script>