Как открыть fancybox попап из попапа?

Question

[Aleksandr]

Подскажите пожалуйста не понимаю уже совсем.
Есть такой js код, открывает fancybox popup и подгружает в него ajax контент.

open: function(e) {
        var view = this
        e.preventDefault()
        var self = $(e.currentTarget)
        var src = self.attr('data-open')
        var href = self.href
        if (src.substr(0, 1) === '#') {
            $.fancybox($(src).html(), {
                type: 'html'
            });
        } else {
            $.fancybox.showLoading()
            $.ajax({
                type: 'get',
                url: src,
                data: {
                    'ajax': '1'
                }
            })
                .done(function(data) {
                    var data = $(data)
                    $(data).find('form').bind('submit', function(e) {
                        view.submitAjax(e)
                    })
                    $.fancybox(data)
                    $('.fancyboxHide').click(function(event) {
                        $.fancybox.close();
                    });
                })
                .fail(function() {
                    $.fancybox.hideLoading()
                    alert('("' + src + '") окно не доступно,\nбудет выполнена переадресация')
                    window.location.href = href
                })
        }
    }

В контенте, который он подгружает есть кнопка, при клике на которую должен открываться другой попап.
Как это сделать?

Answer 1

[Данил Чекалин]

Вы должны после вставки контента который пришел с ajax запроса в fancybox, забиндить событие click на новую кнопку и в обработчике выполнить, то что вы хотите. У fancybox есть события beforeShow, в нем и нужно будет найти node кнопки, которая уже будет вставлена из контента.

.done(function(data) {
  // ...
  $.fancybox(data, {
    beforeShow: function () {
      var $btn = // тут вы смотрите в this и там найдете свойство в виде jquery выборки в котором будет ваш контент

      $btn.on('click', function () {
        // ваши действия
      })
    }
  })
  // ...
})

Comments

[Aleksandr]

Вот посмотрите. Подскажите, а как исправить, что подгружалось ajaxom во второе окно?

$.fancybox(data, {
    beforeShow: function () {
        var $btn = $('[data-open2]');

        $btn.on('click', function () {
            $('.fancybox-inner').empty()
            var src = $(this).attr('data-open2')
            alert(src)
            $.ajax({
                type: 'get',
                url: src,
                data: {
                    'ajax': '1'
                }
            })
                .done(function(data) {
                    console.log('ok')
                })
                .fail(function() {
                    console.log('fuck')
                })
        })
    }
})

[Данил Чекалин]

Я вам написал, что искать надо с this. К тому же посмотрите на название события, оно называется beforeShow, то есть нужный кусок не был добавлен в DOM. Можете заменить на событие afterShow

[Aleksandr]

Данил Чекалин: Можешь прям пример показать? я пока не догоняю :(