As I have a list/table with multiple items which may be removed, I ended up
with:
$('a.delete-button').click(function() {
uid = $(this).data('uid');
});
$('a#delete').click (function() {
// post logic
});
Basically the input from John was the one I used.
Thanks!
On Friday, April 27, 2012 7:24:00 PM UTC+2, Saiful Amri wrote:
>
> $('a#delete').one("click", function() {
> // Handle your post delete logic here
> });
>
>
> On Fri, Apr 27, 2012 at 11:23 PM, John Roberts <[email protected]>wrote:
>
>> Each time the modal is shown, you are binding another click event to the
>> delete button. Move the click event binding outside of the modal show
>> event, I think that might do it for you.
>>
>> I could also recommend a few ways to simplify this entire process...
>> 1. When the a.delete-button is clicked, set the uid directly on the
>> modal's delete button as a data attribute:
>> $('a.delete-button').click( function() {
>> $('a#delete').data('uid', $(this).attr('rel'); // You should also
>> change the uid to a data attribute of this link element:
>> data-uid="{{user.uid.0}}"
>> });
>>
>> 2. You only need to mess with the click event for delete, I'm not sure
>> all of that other stuff is necessary...
>> $('a#delete').click (function() {
>> uid = $(this).data('uid');
>> // Handle your post delete logic here
>> });
>>
>> Hope this helps
>>
>> On Friday, April 27, 2012 6:38:15 AM UTC-7, tinti wrote:
>>>
>>> Hi,
>>>
>>> my modal window used in a table do delete user accounts fires post
>>> action as often as I opened the modal already.
>>> Means on first user deletion the post request is made one time, second
>>> user deletion fires post request 2 times and so on.
>>>
>>> Button to open modal:
>>> <a href="#delete-modal" class="delete-button" data-toggle="modal"
>>> rel="{{ user.uid.0 }}"><i class="icon-trash"></i> Delete</a>
>>>
>>> Modal definition:
>>> <div class="modal hide fad" id="delete-modal">
>>> <div class="modal-header">
>>> <a class="close" data-dismiss="modal">x</a>
>>> <h3>Delete user confirmation</h3>
>>> </div>
>>> <div class="modal-body">
>>> <p>Please confirm removal of user <strong><i
>>> id="uid"></i></strong> by clicking the <strong>Delete</strong> button</p>
>>> </div>
>>> <div class="modal-footer">
>>> {# <a href="#" class="btn btn-primary" data-dismiss="modal"
>>> id="cancel">Cancel</a>#}
>>> <a href="#" class="btn btn-danger" id="delete">Delete</a>
>>> </div>
>>> </div>
>>>
>>>
>>> The js I use to modify and fire things:
>>> $(document).ready(function() {
>>> var uid;
>>>
>>> // Delete button
>>> $('a.delete-button').click(**function() {
>>> uid = $(this).attr('rel');
>>> });
>>>
>>> // Delete function
>>> $('#delete-modal').bind('show'**, function () {
>>> $('.modal-body').empty().html(**"<p>Please confirm
>>> removal of user <strong><i>" + uid + "</i></strong> by clicking the
>>> <strong>Delete</strong> button</p>");
>>> $('#delete').show();
>>> $('i#uid').empty().html(uid);
>>> $('a#delete').click(function()**{
>>> $.post("/admin/delete/user/" + uid + "/",
>>> {"csrfmiddlewaretoken": "{{ csrf_token }}"},
>>> function(data){
>>> console.log("Post " + reload);
>>> $('.modal-body').empty().html(**'<p>' +
>>> data + '</p>');
>>> $('tr#' + uid).remove();
>>> reload = true;
>>> })
>>> .error(function() {
>>> $('.modal-body').empty().html(**"<div class=\"alert alert-error\"><h4
>>> class=\"alert-heading\">**Received an error from
>>> server!</h4><br/>Please try again later.</div>"); })
>>> .complete(function() {
>>> $('a#delete').hide();
>>> });
>>> return false;
>>> })
>>> });
>>> $('a#cancel').click(function()**{
>>> $('#delete-modal').modal('**hide');
>>> });
>>> });
>>>
>>> This is my example, does someone has an idea?
>>>
>>> Thanks!
>>>
>>
>
