Как использовать «изящные модальности» для удаления подтверждения

#javascript #jquery #confirmation

#javascript #jquery #подтверждение

Вопрос:

Я использую это: http://tympanus.net/Development/ModalWindowEffects /

Но проблема в том, как изменить стандартный модальный на что-то вроде javascript confirm() .

Это HTML:

 <!-- Modal -->
    <div class="modal fade" id="mod-delete" tabindex="-1" role="dialog">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">amp;times;</button>
          </div>
          <div class="modal-body">
              <div class="text-center">
                  <div class="i-circle warning"><i class="fa fa-warning"></i></div>
                  <h4>Big warning!</h4>
                  <p>You are going to delete this item!</p>
              </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
            <button type="button" id="delete-yes" class="btn btn-warning" data-dismiss="modal">Continue</button>
          </div>
        </div><!-- /.modal-content -->
      </div><!-- /.modal-dialog -->
    </div><!-- /.modal -->
  

И это ссылка, которая запускает это событие:

 <a class="label label-danger delete-confirmation" data-toggle="modal" data-target="#mod-delete" href="{$base_url}user/delete/{$user.UserID}"><i class="fa fa-times"></i></a>
  

Затем я делаю это:

 // universal delete confirmation dialog
$('#delete-yes').on('click',function(){
    window.location = $(".delete-confirmation").attr('href');
});
  

Но! Селектор $('.delete-confirmation') получает каждый элемент на странице (я удаляю пользователей из БД). Я хочу подтвердить удаление только одного элемента, на который нажат.

Просто: я нажимаю, чтобы удалить пользователя (эта ссылка имеет атрибут «href» — содержит ссылку на удаление). Я вижу модальное окно, если я нажму «Продолжить», я перейду к удалению ссылки этого элемента.

Есть ли кто-нибудь, у кого эта проблема решена?

Ответ №1:

Я бы предложил:

  1. Передайте значение href ссылки, на которую вы нажали, в модальный div, вы можете сделать это примерно так:

    $('.delete-confirmation').on('click',function(){
    $('#mod-delete').attr("nhref", $(this).attr("href));
    });

  2. После того, как вы передали значение href в модальный div, вы можете использовать:

    $('#delete-yes').on('click',function(){
    window.location = $("#mod-delete").attr('nhref');
    });

Вероятно, не лучшее решение, но оно должно работать (возможно, необходимы небольшие изменения в коде, но общая идея работает).

Надеюсь, это поможет.