MOneAtt MOneAtt -4 years ago 139
jQuery Question

Primefaces p:calendar and format user input into proper date

Here's my problem:

I need a way to not validate (that's done already) but format/convert user input into this format: MM/dd/yyyy

Using JSF and Primefaces and sadly you can't use p:maskinput with p:calendar or my problem would be really super easy to fix.

I've searched and searched, and tried and tried many things to get it to work with no solution.

I believe my solution lies in this link: http://digitalbush.com/projects/masked-input-plugin/

Here's what the code looks like:

<p:outputLabel value="#{originalreturned}: " />

<p:calendar value="#{origReturnedDate}"
showOn="button"
pattern="MM/dd/yyyy"
showButtonPanel="true"
navigator="true"
id="originalRetDate"
onblur="formatDate(id);"
size="10"
yearRange="#{commonUtils.getCalendarRange()}"
rendered="#{!isDocumentInquiryMode}">

<f:convertDateTime pattern="MM/dd/yyyy"/>

<f:attribute name="dateLabel" value="#{document_approved}"/>

</p:calendar>

<h:inputText id="date" value="#{origReturnedDate}" rendered="#{isDocumentInquiryMode}">
<f:convertDateTime pattern="MM/dd/yyyy" />
</h:inputText>


I just don't know how to incorporate and use the plugin from the link above or if there is a different way I'm missing?

I've tried following the standards for JSF and PrimeFaces on importing an external .js file. But it doesn't work at all.

Thanks for any advice you might have for me

Example of plugin:
http://jsfiddle.net/smdvA/579/

Answer Source

it's true that's too late but may be could help someone else . you can't use Mask but you can do it with regex expression for exemple :

<p:calendar value="#{MyBean.MyDate}" id="MyCalendar"  effect="explode"  >
            <f:validateRegex pattern="^(?:(?:31(\/|-|\.)(?:0?[13578]|1[02]))\1|(?:(?:29|30)(\/|-|\.)(?:0?[1,3-9]|1[0-2])\2))(?:(?:1[6-9]|[2-9]\d)?\d{2})$|^(?:29(\/|-|\.)0?2\3(?:(?:(?:1[6-9]|[2-9]\d)?(?:0[48]|[2468][048]|[13579][26])|(?:(?:16|[2468][048]|[3579][26])00))))$|^(?:0?[1-9]|1\d|2[0-8])(\/|-|\.)(?:(?:0?[1-9])|(?:1[0-2]))\4(?:(?:1[6-9]|[2-9]\d)?\d{2})$">
             <p:ajax update="msgMyCalendar" event="keyup" />   
           </f:validateRegex>
             </p:calendar>
              <p:message for="MyCalendar" id="msgMyCalendar" display="icon"/> 
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download