Динамически закрыть диалог

Question

В моей jQM - приложение Backbone добавить диалог программно, если определенное условие истинно, как этот

$('body').append('<div data-role="dialog" id="interlink" data-theme="b" data-close-btn="none" data-url="insignificant"></div> '); 
// remove dialog from DOM on pagehide 
$("#interlink").on('pagehide', function() { 
    $(this).remove(); 
    // remove this views popup-containers 
    $('#interlink-video-popup-popup').remove(); 
}); 

Beside другого контента в диалоговом окне есть кнопка, чтобы открыть всплывающий виджет играть видеоклип и кнопку закрытия, чтобы закрыть диалоговое окно. Код для закрытия диалогового окна выглядит следующим образом:

backBtnHandler: function(e) { 
    e.preventDefault(); 
    $('#interlink').dialog('close'); 
    $(this).remove(); // all DOM listeners get removed as well by jQuery 
}  

Это работает все хорошо, если видео клип смотрел на всю длину, всплывающий виджет закрывается закончился, и пользователь нажимает кнопку Закрыть диалоговое окно, чтобы закрыть его. Требование заключается в том, когда видеоролик воспроизводится, и пользователь сканирует другой тег NFC, который должен остановить видео, вызвать завершенное событие и закрыть всплывающее окно. Это также работает, однако диалог также должен быть закрыт. Вот упрощенный фрагмент кода с тайм-аут для имитации NFC сканирования:

INTERPRETOUR.interlinkVideoPlayer = $('#interlink-video-player')[0]; 
// bind onended event to close the popup 
$(INTERPRETOUR.interlinkVideoPlayer).on('ended', function() { 
    $('#interlink-video-popup').popup('close'); 
    INTERPRETOUR.interlinkVideoPlayer = 'undefined'; 
    $('#interlink-back-btn').trigger('click'); 
}); 
// play video 
INTERPRETOUR.interlinkVideoPlayer.src = 'http://mydomain.ca' + this.model.get('video')[0].url; 
INTERPRETOUR.interlinkVideoPlayer.play(); 
setTimeout(function() { 
    $.publish('item', '2479'); 
}, 5000); 

Вопрос заключается в том, что $('#interlink-back-btn').trigger('click'); вызывает метод backBtnHandler но pagehid е никогда не срабатывает и поэтому диалог не закрывается.

Любая помощь для решения этой проблемы была бы очень признательна.

Answer 1

Вместо вызова кнопки с использованием .trigger('click'), свяжите закрытие, когда popupafterclose триггеры событий.

Demo 1/Demo 2

Статический Всплывающее

$('#popupID').on('popupafterclose', function() { 
    $('#dialogID').dialog('close'); 
}); 

Динамически генерируемые Popup

$(document).on('popupafterclose', '#popupID', function() { 
    $('#dialogID').dialog('close'); 
});