Question

我在jquery模式对话框中使用select2组件。我需要下拉菜单显示在对话框的边框之外。现在，长对话框被对话框边框截断。

以下是一个示例和jsfiddle：

<div id="test-dialog" class="widget" style="display:none;">
    <form id="Newfrm" name="Newfrm" method="post">
        <fieldset id="Field" step="1" style="margin-top: 10px;">
            <label for="NewField" style="width:90px; text-align:right;">Field</label>
            <select name="NewField" id="NewField">
                <option value=""></option>
                <option value="1">test1</option>
                <option value="2">test2</option>
                <option value="3">test3</option>
                <option value="4">test4</option>
            </select>
        </fieldset>
    </form>
</div>

$("#NewField").select2({
            placeholder: "Select a Field",
            allowClear: true,
            dropdownParent: $('#test-dialog')
        });

$("#test-dialog").dialog({
            width: "550",
            resizable: false,
            modal: true
        }).dialog('option', 'title', 'New Test Dlg');

Answer 1

解决方案是改变

<div id="test-dialog" class="widget" style="display:none;">

到

<div id="test-dialog" class="widget" style="display:none; overflow:visible !important">

如何将select2组件下拉扩展到jquery模式对话框

1 个答案: