Criei um alto complete com o jquery, mais a caixa de retorno esta subindo para o topo da pagina, como poderia ajustar?
Segue imagem de exemplo:
Segue o código do autocomplete:
Teste 01
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#produto").autocomplete({
source: 'functions/pesquisa-itens.php',
minLength: 1,
select: function(event, ui) {
$('#produto').val(ui.item.prod_final);
},
position: {
my: "left bottom",
at: "left top",
of: $("#produto"),
collision: "flip flip"
}
});
});
Teste 02:
$(document).ready(function() {
$("#produto").autocomplete({
source: 'functions/pesquisa-itens.php',
minLength: 1,
select: function(event, ui) {
$('#produto').val(ui.item.prod_final);
}
});
});
$(".ui-autocomplete").position({
my: "left bottom",
at: "left top",
of: $("#produto"),
collision: "flip flip"
});
HTML:
<form class="form-horizontal">
<div class="row">
<div class="col-md-6">
<div class="ui-widget">
<label for="produto">Produto:</label>
<input type="text" class="form-control" id="produto" name="produto">
</div>
</div>