Ajax auto-complete, custom popup layout

I am doing something that involves auto-filling phrases in ajax's <textarea>. This works fine for me using the jquery autocomplete plugin; however, it is hardcoded to position the popup below <textarea>.

For what I'm working on, <textarea>is at the bottom of the page; I ideally want the options displayed above <textarea>.

Is there a similar existing (and half worthy) autocomplete script that will allow this? My other options are:

  • try reinstalling it after the fact using more jquery
  • hack plugin code into pieces to move it
  • write something from scratch (it sounds simple, but there are a few nuances in decent autocomplete)

Suggestions?


For reference, here is what I ended up with:

#known-parent .ac_results 
{
    position: fixed !important;
    top: auto !important;
    bottom: 80px !important;
}
+3
source share
2 answers

This is not the cleanest solution in the world, but you can overwrite the style properties that the autocomplete plugin writes using "! Important" in your css.

Styles in CSS as much as possible.

If I remember correctly, the plugin sets the "upper" value in the "style" attribute in the autosuggest element.

In your css you can just do:

#whatever_the_id_of_the_box_is {
    position: absolute !important;
    top: {{ whatever value you want here }} !important;
}
+4
source

Can you change the CSS of the popup and assign negative margin-top values? This should move the content to the beginning, but your results will look a little strange, as the corresponding values ​​will be on top.

, style ? , , .

<div style="display: none; position: absolute; width: 151px; top: 21px; left: 91.65px;" class="ac_results"></div>

.

: . . , . ,

+1

Source: https://habr.com/ru/post/1753576/


All Articles