JavaScript: $('.delete_icon').click(function(){ var obj = $(this) var csrf_token = "{{ csrf_token }}"; var email = $(this).attr('value'); var id = $(this).attr('id'); $.ajax({ data:{csrfmiddlewaretoken: csrf_token,id:id,cancel_email:email}, type:'POST', url: '/report/notification/', cache:false, success: function(response) { $(obj).parent('p').remove(); return false; } }); }); });
HTML: <span style="font-weight:bold;float:left;width:100%"> {% for email_list in email_list%}<p> <p><input type="button" name="delete_image" id="{{email_list.report_id}}" value="{{email_list.id}}" class="delete_icon" />{{email_list.email}}</p> </p>{% endfor %}</span> code for Popup to confirm the delete operation: HTML: <div id="overlay_form" style="display:none1" > <h2> Are You sure want to delete</h2> <br /> <div style="width:180px;float:right;margin:10px 5px 0 10px"> <button style="margin-right:10px;" type="button" class="close" name="cancel" class="forward backicon"> <img src="{{ STATIC_URL }}images/button-icon-ir-back.png" width="12" height="17" alt="" />No</button> <button style="margin-right:10px;" type="button" class="close" name="cancel" class="forward backicon"> <img src="{{ STATIC_URL }}images/button-icon-ir-fwd.png" width="12" height="17" alt="" /> Yes</button> </div> </form></div> JavaScript $('.delete_icon').click(function(){ var obj = $(this) var csrf_token = "{{ csrf_token }}"; var email = $(this).attr('value'); var id = $(this).attr('id'); $.ajax({ data:{csrfmiddlewaretoken: csrf_token,id:id,cancel_email:email}, type:'POST', url: '/report/notification/', cache:false, success: function(response) { $(obj).parent('p').remove(); return false; } }); }); }); HTML <span style="font-weight:bold;float:left;width:100%"> {% for email_list in email_list%}<p> <p><input type="button" name="delete_image" id="{{email_list.report_id}}" value="{{email_list.id}}" class="delete_icon" />{{email_list.email}}</p> </p>{% endfor %}</span> ------------------------------ code for Popup to confirm the delete operation,On clicking delete_icon class,the below popup should open and ask the confirmation HTML <div id="overlay_form" style="display:none1" > <h2> Are You sure want to delete</h2> <br /> <div style="width:180px;float:right;margin:10px 5px 0 10px"> <button style="margin-right:10px;" type="button" class="close" name="cancel" class="forward backicon"> <img src="{{ STATIC_URL }}images/button-icon-ir-back.png" width="12" height="17" alt="" />No</button> <button style="margin-right:10px;" type="button" class="close" name="cancel" class="forward backicon"> <img src="{{ STATIC_URL }}images/button-icon-ir-fwd.png" width="12" height="17" alt="" /> Yes</button> </div> </form></div> In HTML, delete_icon is an image class in which if I click it, the *email id * gets deleted without any confirmation message. I want to add a popup to display when delete_icon is clicked. The popup mentioned above should open and if yes is clicked, the instance should get deleted, otherwise it should return the same. How can I achieve this. Thanks -- You received this message because you are subscribed to the Google Groups "Django users" group. To unsubscribe from this group and stop receiving emails from it, send an email to django-users+unsubscr...@googlegroups.com. To post to this group, send email to django-users@googlegroups.com. Visit this group at http://groups.google.com/group/django-users?hl=en. For more options, visit https://groups.google.com/groups/opt_out.