In one my asp.net mvc cshtml files, we are using jqxdropdown inside a Bootstrap Modal dialog. The filtering option is getting disabled for the jqxdropdown when it is inside the modal as indicated below. testddn is the id of the jqxDropdown.
<div class=”modal fade bd-example-modal-lg” id=”addTextModal” tabindex=”-1″ role=”dialog” aria-labelledby=”addTextModalTitle” aria-hidden=”true” data-backdrop=”static”>
<div class=”modal-dialog modal-dialog-centered modal-lg” role=”document”>
<div class=”modal-content”>
<div class=”modal-header”>
<h5 class=”modal-title” id=”exampleModalLongTitle”>Test Modal</h5>
</div>
<div class=”modal-body container-fluid” id=”addText”>
<form>
<div class=”form-group”>
<b><label for=”testddn”>Test Dropdown:</label></b>
<div id=”testddn”></div>
</div>
</form>
</div>
<div class=”modal-footer”>
</div>
</div>
</div>
</div>
jqxDropdown is populated as below.
$(‘#testddn’).jqxDropDownList({ checkboxes: true, source: ddTest_DataAdapter, displayMember: ‘TestName’, valueMember: ‘TestId’, autoDropDownHeight: false, theme: ‘metro’, filterable: true, dropDownWidth: 300 });