Keyfaces примесь или другая задержка события ajax

У меня есть что-то вроде:

<p:inputText...>
    <p:ajax event="keyup" update="somefield" listener="#{someBean.doSomething}"/>
</p:inputText>

Но я не хочу делать запрос Ajax на каждом нажатии клавиши, я хотел бы сделать запрос через полсекунды после того, как пользователь перестанет писать.

Я видел, что эта проблема решена в jQuery в другом вопросе: Как задержать обработчик .keyup(), пока пользователь не перестанет печатать?

Я хотел бы знать, возможно ли это сделать на простых поверхностях или как адаптировать решение из вопроса jQuery.
Я использую PrimeFaces 3.0.M4.
Заранее благодарю вас.

Ответ 1

Почему вы не используете компонент RemoteCommand в PrimeFaces?

Он предоставляет вам глобальную функцию Javascript, которую вы можете звонить из любой точки мира. И он позволяет вам вызвать метод managed- bean и имеет атрибут update для частичного обновления.

<p:inputText id="input" />

<h:form>
    <p:remoteCommand name="sendAjaxical" update="somefield" action="#{someBean.doSomething}"/>
</h:form>

Зарегистрировать обработчик событий, я взял взаймы тот же ответ, который вы отправили:

var delay = (function() {
    var timer = 0;
    return function(callback, ms) {
        clearTimeout (timer);
        timer = setTimeout(callback, ms);
    };
})();


jQuery("#input").keyup(function() {
    delay(function() { sendAjaxical(); }, 2000); //sendAjaxical is the name of remote-command
});

Ответ 2

При использовании Primefaces 5.x в теге p:ajax для этого есть атрибут delay. Так оно и было:

<p:inputText...>
    <p:ajax event="keyup" delay="1000" listener="#{someBean.doSomething}"
        update="somefield" process="@this" />
</p:inputText>

Если нет, вы можете достичь этого, используя f:ajax вместо p:ajax (да, он также работает с p:inputText). f:ajax добавила поддержку управление очередью, начиная с JSF 2.2. Таким образом, код выглядит так:

<p:inputText...>
    <f:ajax event="keyup" delay="1000" listener="#{someBean.doSomething}"
        render="somefield" execute="@this" />
</p:inputText>

См. также:

Ответ 3

Вы не можете использовать компонент Ajax для Primefaces, если вы выбрали решение jquery/javascript. Вам нужно будет реализовать свою собственную функцию javascript (с поддержкой ajax/xmlHttpRequest) и запустить эту функцию через полсекунды.

Но есть еще одно решение - обходной путь: вы можете использовать компонент autocomplete и использовать 3 полезных атрибута: valueChangeListener (A method expression that refers to a method for handling a valuchangeevent - вы используете это вместо completeMethod, потому что вам не нужны возвращаемые предложения), queryDelay (Delay to wait in milliseconds before sending each query to the server) и minQueryLength (Number of characters to be typed before starting to query - если вы не хотите запускать ajax запрос после ввода только одного символа).

Надеюсь, вы найдете это решение тихим интересным... Пожалуйста, смотрите здесь компонент автозаполнения (http://www.primefaces.org/showcase-labs/ui/autocompleteHome.jsf), и вы можете узнайте больше, прочитав Руководство пользователя Primefaces для версии 3.0.M4.

Ответ 4

Быстрый хак будет добавлять задержку в onstart p:ajax. Определите следующую функцию где-нибудь в вашем javascript:

function keyupDelay(request, cfg, delay) {
    delay = delay || 2000;// if no delay supplied, two seconds are the default seconds between ajax requests
    setTimeout(function() {
        cfg.onstart = null;
        request.send(cfg)
    }, delay);
    return false;
}

В основном эта функция запускает запрос ajax в определенный тайм-аут, возвращая false для немедленного, и опуская onstart на этот запрос тайм-аута, чтобы не застрять в неприятном цикле.

Затем на p:ajax:

<p:ajax event="keyup" onstart="return keyupDelay(this, cfg)" />

Параметр задержки здесь необязательный, по умолчанию он составляет 2 секунды.