Search code examples
jqueryjquery-uiselecttitlebar

jQuery-UI Dialog - Select don't work in titlebar

I want put a select in a title bar of a jQuery-UI dialog, but when the select is clicked it doesn't open dropdown menu.

This is my HTML code:

<div id="myDialog"></div>

This is my jQuery code:

$("#myDialog").dialog({});
var selLang='<select class="selLang "><option value="ita">ITA</option><option value="eng">EN</option></select>';
$("#myDialog").dialog("open");
$("#myDialog").dialog("option", "title", selLang);
$("#myDialog").append($(selLang));
$("#myDialog").dialog('widget').find('.ui-dialog-titlebar').append($(selLang));

Can you see the result here

Solution

  • Try this. It will allow you to drag modal also and allow to select dropdown from title.

    $('.selLang').hover(function() {
    $("#myDialog").dialog('option', 'draggable', false);
},function(){
    $("#myDialog").dialog('option', 'draggable', true);
})