My jquery autocomplete
is not showing the suggestions list when used inside a bootstrap modal, but is working outside the modal. Why is it happening???? Can anyone help?
<style type="text/css">
.ui-front {
z-index:1001;
}
</style>
<div class="modal fade" id="addform" tabindex="-1" role="dialog">
<div class="form-line">
<input type="text" class="form-control" name="username" id="username" autocomplete="off" required>
</div>
</div>
<script type="text/javascript">
var base = '<?php echo base_url(); ?>';
$(document).ready(function(){
$("#t1").dataTable();
var menuid = '<?php echo $frmid; ?>';
$("input#username").autocomplete(base + "/index.php/GulfMasters/AutoComplete?a=" + menuid, {
width: 120,
matchContains: true,
selectFirst: false,
appendTo: "#addform",
});
});
</script>`;
Suggestions are showing on network tab when I inspect the element , but not showing inside the modal.