Показать меню выбора в JQuery подтвердить

Question

У меня есть jQUery-подтверждение, и я пытаюсь отобразить некоторый контент, у которого есть select, и мой select.selectMenu(), похоже, не работает, потому что он отображается внутри jQUery-подтверждения. Он просто показывает выбор по умолчанию. Я могу легко вызвать.selectMenu () для выбора вне области действия, и он изменится с выбора на меню выбора. Пример:

HTML:

 <div id="aDiv"> 
     <select id="aSelect"> <option value="1"> 1 </option></select>
 </div>
 <button type="button" id="aButton">Click </button>

CSS:

#aDiv {
     display: none;
}

JS:

$(document).ready(function() {
  $('#aSelect').selectmenu();
  var divVar = $('#aDiv');
  $('#aButton').on("click", function() {
       $.confirm( {
            title: 'Hello',
            content: '',
            onOpen : function() {
                divVar.show();
                this.setContent(divVar);
            },
            onClose : function() {
               divVar.hide();
            }

         });
     });
 });          

Как сделать так, чтобы jquery-подтверждение показывало такие виджеты jquery ui, как selectmenu?

Answer 1

Попробуйте это, вам нужно добавить html-разметку внутри jconfirm и инициализировать плагин selectMenu, лучше писать разметку внутри содержимого, а не определять его снаружи.

$(document).ready(function() {
    // $('#aSelect').selectMenu();
    $('#aButton').on("click", function() {
        $.confirm( {
            title: 'Hello',
            content: function(){
                return $('#aDiv').html(); // put in the #aSelect html, 
            },
            onContentReady : function() {
                this.$content.find('#aSelect').selectMenu(); // initialize the plugin when the model opens.
            },
            onClose : function() {

            }
        });
    });
});  

Answer 2

Пожалуйста, попробуйте следующее:

Вы пропустили # для идентификатора

$(document).ready(function() {
  $('#aSelect').selectMenu();
  var divVar = $('#aDiv');
  $('#aButton').on("click", function() {
       $.confirm( {
            title: 'Hello',
            content: '',
            onOpen : function() {
                divVar.show();
                this.setContent(divVar);
            },
            onClose : function() {
               divVar.hide();
            }

         });
     });
 });