Hello,
I would like to make some improvements to the ajax loader icon layout, since users are reporting that they do not realize that the icon is loading in the corner, how do I center it on the screen? and maybe also put some modal effect to give a highlight so that the user waits for the loading of the ajax.
https://imgur.com/iLsqyEQ
Loader Ajax
Forum rules
Please note that response time for technical support is within 3-5 business days.
Please note that response time for technical support is within 3-5 business days.
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
Hi,
Please try the following code instead of p:ajaxStatus in the current template.xhtml;
Best Regards,
Please try the following code instead of p:ajaxStatus in the current template.xhtml;
Code: Select all
...
<p:ajaxStatus onstart="PF('statusDialog').show()" onsuccess="PF('statusDialog').hide()" />
<p:dialog widgetVar="statusDialog" modal="true" draggable="false" closable="false" resizable="false" showHeader="false" style="background-color: transparent; box-shadow: none; border: 0 none;">
<i class="fa fa-circle-o-notch fa-spin" style="font-size: 50px; color: #2196F3" aria-hidden="true"></i>
</p:dialog>
...
Github Profile: https://github.com/mertsincan
Hello,
It will really be perfect, I just need to remove the scroll bars that are being created according to the image. any solution for that little detail?
https://imgur.com/lhi4Iso
It will really be perfect, I just need to remove the scroll bars that are being created according to the image. any solution for that little detail?
https://imgur.com/lhi4Iso
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
Hi,
You can add width and height styles to dialog.
You can add width and height styles to dialog.
Code: Select all
<p:ajaxStatus onstart="PF('statusDialog').show()" onsuccess="PF('statusDialog').hide()" />
<p:dialog widgetVar="statusDialog" modal="true" draggable="false" closable="false" resizable="false" showHeader="false" style="background-color: transparent; box-shadow: none; border: 0 none; width: 120px; height: 100px;">
<i class="fa fa-circle-o-notch fa-spin" style="font-size: 50px; color: #2196F3" aria-hidden="true"></i>
</p:dialog>
Github Profile: https://github.com/mertsincan
-
- Information
-
Who is online
Users browsing this forum: No registered users and 10 guests