Confirmation on list item click then follow href

Question

I'm currently using Django in my template to generate href for each list element and on the url , a certain method is executed, removing the item from the list, however I'd like a confirmation box to appear to assure the user they wish to delete it.

The only issue is the url is dynamic, and changes for each element of the list using django variables, shown below:

    <div id="list5">
    <ul>
{% if results %}
  {% for result in results %}
<li><a href="/accounts/delete/{{result.0}}/{{result.1}}"><strong>{{result.0}}</strong>evaluating {{result.1}}</a></li>
{% endfor %}
{% else %}
<li><a href="#"><strong>Assessor</strong>evaluating Assessee</a></li>
{% endif %}

As a result, inline javascript onclick methods, and JQuery that I've been able to find on stack overflow doesn't seem to be working for me, is there a way I can generate a confirmation box (browser confirm is fine) on clicking of the list element, which then on a "yes" redirects and follows the url from the list element that the click was made from?

Answer 1

You should be able to use a setup like this:

jQuery:

$(document).ready(function() {
    $('.deleter').click(function() {
        if(confirm('Are you sure you want to delete this?') == true) {
            window.open($(this).attr('goto'));
        }
    })
})

Template:

<div id="list5">
   <ul>
   {% if results %} 
   {% for result in results %}
      <li class='deleter' goto='/accounts/delete/{{result.0}}/{{result.1}}'><strong>{{result.0}}</strong>evaluating {{result.1}}</li>
   {% endfor %}
   {% else %}
      <li><a href="#"><strong>Assessor</strong>evaluating Assessee</a></li>
   </ul>
   {% endif %}
</div>