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 секунды.