有限制的自动完成 [英] Autocomplete with restriction

问题描述

我正在尝试使用引导程序来完成一项自动完成功能，该功能可在仅当相关inputText包含4个以上字符时才显示选项列表的inputText上工作. 这是我的xhtml:

I am trying to do, using bootstrap, an autocomplete function which works over an inputText having to show the options list only when the related inputText contains more than 4 characters. This is my xhtml:

<script>
    $(function(){
      jQuery.noConflict();

      var autocompPerson = $('.autocomp'); 

      autocompPerson.typeahead({

      source: [#{operationsFormBean.allPersonFilteredList}],

      });
    });
</script>

<div class="col-md-8 pb0 pl0">
        <h:inputText id="auPerson"
            value="#{backingBeanRef['selectedPersonName']}"
            styleClass="form-control autocomp wo-borders bg-transparent">
         <a4j:ajax 
          event="keyup" listener="#{backingBeanRef['personFilteredList']}"
          render="operations_form_panel"/>
       </h:inputText>

</div>

personFilteredList()方法位于我的Java Bean中，它是控制输入的字符数不超过4个的人.

The method personFilteredList() is in my java Bean and it is the one who controls if the input has or not more than 4 characters.

如果我使用事件"keyup"，则每当我在inputText中写入一个字符时，我都会失去对它的关注，列表会立即消失.我知道它正在工作，因为它仅在我输入四个以上字符时才显示列表.问题是:调用该方法时，我必须渲染inputText才能显示该列表，这使我失去了使列表消失的焦点.

If I use the event "keyup", whenever I write a character in my inputText, I lose the focus over it and the list disappears immediatly. I know it is working since it shows the list only when I write more than 4 characters. The problem is : when the method is called I have to render the inputText in order to show the list and it makes me lose the focus over which makes the list disappears.

您知道我是否可以使用js函数(例如"updater")在每次编写某些内容时不使用事件键更新来更新我的selectedPersonName吗?

Do you know if I can use a js function like "updater" which updates my selectedPersonName every single time I write something without using the event keyup?

谢谢.

推荐答案

使用AJAX oncomplete JS回调挂钩更新typeahead的源，然后仅重新呈现inputText.请参阅此帖子，以在提前引导.

Use the AJAX oncomplete JS callback hook to update your source for typeahead and re-render just the inputText. See this post for resetting the source in bootstrap typeahead.

这篇关于有限制的自动完成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！