можно ли изменить форму курсора мыши в режим занятости (например, песочные часы) при обработке кнопки ajax в JSF (в частности, простые лица)? Я хочу изменить форму моего курсора, пока мой p: dataTable загружает данные, когда я перехожу на следующую страницу. Спасибо.
Переведите курсор мыши в режим занятости, когда выполняется запрос ajax PrimeFaces
Ответы (2)
Вы можете добиться этого с небольшой помощью CSS и jQuery. С помощью CSS вы можете создать класс, который изменяет курсор во всем документе. С помощью jQuery вы можете добавлять/удалять этот класс CSS. Под прикрытием PrimeFaces использует jQuery для магии ajax, и вы можете для PrimeFaces ‹4 перехватывать стандартные события jQuery ajaxStart
и ajaxStop
, а для PrimeFaces 4+ перехватывать определенные события PrimeFaces pfAjaxSend
и pfAjaxComplete
для выполнения добавления/удаления этого класса CSS.
CSS:
html.progress, html.progress * {
cursor: progress !important;
}
(в этом случае !important
переопределяет любой стиль, заданный атрибутом style
и более сильными селекторами CSS)
jQuery и PrimeFaces:
$(document).on("ajaxStart pfAjaxSend", function() {
$("html").addClass("progress");
}).on("ajaxStop pfAjaxComplete", function() {
$("html").removeClass("progress");
});
В случае, если вы также используете стандартный JSF <f:ajax>
в другом месте и хотели бы иметь такой же индикатор выполнения, вот как вы можете это сделать:
jsf.ajax.addOnEvent(function(data) {
$("html").toggleClass("progress", data.status == "begin");
});
Это также используется демонстрационным приложением OmniFaces. Вы можете увидеть его среди прочих, запустив опрос на этой странице.
Primefaces сам по себе не похож на это. У него есть некоторые компоненты, которые позволяют визуализировать его работу (AjaxStatus, BlockUI), но не похоже, что он что-то делает с курсором.
Для этого вам нужно будет напрямую использовать Javascript. Это выглядит как хороший вариант.
изменить курсор на "занято" во время загрузки страницы