JSF Primefaces Indicator

This example will show how to show a loader indicator while data is being fetch from the server. <h:panelGrid columns=”1″ id=”searchPanelGrid”> <h:panelGroup> <p:inputText id=”employeeId” placeholder=”Employee Id” required=”true” requiredMessage=”Employee Id is required” value=”#{createAdminController.employeeId}”/> <p:commandButton value=”Search in VCN” update=”ldapPanel @form” actionListener=”#{createAdminController.searchInVCN}” id=”searchButton”/> </h:panelGroup> </h:panelGrid> <p:blockUI block=”searchPanelGrid” trigger=”searchButton”> <h:graphicImage library=”images” name=”loader.gif”/> </p:blockUI>   https://www.primefaces.org/showcase/ui/misc/blockUI.xhtml http://ajaxload.info/ https://answers.axonivy.com/questions/14/how-to-create-a-loading-indicator-in-a-html-user-dialog/15

Displaying messagebox from backing bean

This piece of code snippet will initially hide the primefaces dialog box, then in any action from the backing bean, it will be activated and seen Back bean RequestContext context = RequestContext.getCurrentInstance(); context.execute("PF('dlgBlackListVar').show();"); View <p:dialog id="dlgBlackList" widgetVar="dlgBlackListVar" header="#{msg.member_blacklist_header}" showEffect="clip" modal="true" visible="false"> <h:outputText value="#{msg.member_blacklist_content}" /> </p:dialog>

Primefaces navigating in between min and max dates

Today at work I was stuck at demonstrating all the possible years which are given by min and max date ranges in the backing bean in primefaces and jsf combo. So as default primefaces calendar component only displays just set the year range to maximize the value the way you wish <p:calendar id="birthdate" value="#{memberController.order.birthdate}" yearRange="c-70:c+10"

Catching Primefaces form elements in jquery and preventing copy paste and cut operations

xhtml <p:inputText id="firstName" placeholder="#{msg.member_name}" value="#{memberController.order.firstName}" size="30" maxlength="30" widgetVar="firstNameVar" required="true" styleClass="#{not component.valid ? 'ui-input-invalid default-input-text' : 'default-input-text'}" onkeypress="return disallowNonAlphabethCharacters(event);"> <p:ajax delay="1000" event="keyup" oncomplete="rc([{name: 'component', value: ':primeForm:firstName'}, {name: 'widget', value: 'firstNameVar'}]);" /> </p:inputText> javascript <script type="text/javascript"> $( document ).ready(function() { PF('firstNameVar').jq.bind('cut copy paste', function(e) { e.preventDefault(); }); PF('firstNameVar').jq.bind("contextmenu", function(e) { e.preventDefault(); }); }); </script>