2017-01-12 6 views
1

Ich habe eine jQuery-Bestätigung und ich versuche, einige Inhalte anzuzeigen, die eine Auswahl haben und meine select.selectMenu() scheint nicht zu funktionieren, weil es in der jQuery-confirm angezeigt wird. Es zeigt nur die Standardauswahl an. Ich kann einfach selectMenu() auf einer Auswahl außerhalb des Bereichs aufrufen und es wird von Auswahl zu Auswahlmenü wechseln. Beispiel:Display Auswahlmenü in jQuery bestätigen

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:

Wie kann ich jQuery-confirm zeigen jQuery UI-Widgets wie selectmenu machen?

Antwort

1

dies versuchen, müssen Sie HTML-Markup innerhalb jConfirm hinzuzufügen und das selectMenu Plugin zu initialisieren, ist es besser, um das Markup in den Inhalt zu schreiben, anstatt es außerhalb zu definieren.

$(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() { 

      } 
     }); 
    }); 
}); 
+0

Es etwas gearbeitet, aber jetzt habe ich ein neues Problem. Das Dropdown-Menü befindet sich hinter dem Jquery-Inhaltsfenster. Hier klicken: http://imgur.com/a/ayoJz. Auch selectMenu() muss .selectmenu() sein :) – jones

+0

ich dachte vielleicht '.ui-selectmenu-menu { \t \t z-index: 9999; \t \t} 'in der CSS würde das Problem lösen, aber ich lag falsch, es hat nicht funktioniert. – jones

+0

Wie bekomme ich den Z-Index von jquery-confirm $ .confirm Fenster? – jones

1

Bitte versuchen Sie folgendes:

Sie die # verpasst haben für id

$(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(); 
      } 

     }); 
    }); 
});  
+0

vergessen ‚#‘ in Beispiel hinzuzufügen, ich sie in meiner ursprünglichen Code haben, bearbeitet die Frage – jones

Verwandte Themen