I have just face a problem using ejDialog in Javascript that I can`t solve by myself. I have a <select> html tag inside my ejDialog which doesn`t shown its dropdown list with <option> tags after I initialize select2 on it. Concretely if I click on my <select> html object then the list is sliding down in the end of the ejDialog and not in the front. If I resize my ejDialog I can see my select`s list in the back of my Dialog. Without select2 it works fine, so my question is: is there a way to use select2 correctly with ejDialog in Javascript? I am using Syncfusion version 13.2.0.29 and Select2 version 4.0.0.
My ejDialog declaration in JavaSctipt is:
$("#editForm").ejDialog({
showOnInit: false,
enableModal: true,
width: 500,
allowDraggable: true,
showHeader: true,
enableResize: true,
enabled: true,
showRoundedCorner: true,
actionButtons: ["close", "collapsible", "minimize", "pin"]
});
HTML:
<div id="editForm" title="...">
.....
<select class="myselect" style="width:200px;">
<option value="2">1231</option>
....
</select>
</div>
And finally I have a simple select2 initializer:
$(".myselect").select2();
Thanks in advice: Daniel
Thank you Harikrishnan!