title: Primefaces p:calendar and format user input into proper date
body: <p>Here's my problem:</p>
  
  <p>I need a way to not validate (that's done already) but format/convert user input into this format: MM/dd/yyyy</p>
  
  <p>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.</p>
  
  <p>I've searched and searched, and tried and tried many things to get it to work with no solution. </p>
  
  <p>I believe my solution lies in this link: <a href="http://digitalbush.com/projects/masked-input-plugin/" rel="nofollow">http://digitalbush.com/projects/masked-input-plugin/</a></p>
  
  <p>Here's what the code looks like: </p>
  
  <pre><code>&lt;p:outputLabel value="#{originalreturned}: " /&gt;
  
  &lt;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}"&gt;
  
      &lt;f:convertDateTime pattern="MM/dd/yyyy"/&gt;
  
      &lt;f:attribute name="dateLabel" value="#{document_approved}"/&gt;
  
  &lt;/p:calendar&gt;
  
  &lt;h:inputText id="date" value="#{origReturnedDate}" rendered="#{isDocumentInquiryMode}"&gt;  
       &lt;f:convertDateTime pattern="MM/dd/yyyy" /&gt;
  &lt;/h:inputText&gt;
  </code></pre>
  
  <p>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?</p>
  
  <p>I've tried following the standards for JSF and PrimeFaces on importing an external .js file. But it doesn't work at all.</p>
  
  <p>Thanks for any advice you might have for me</p>
  
  <p>Example of plugin:
  <a href="http://jsfiddle.net/smdvA/579/" rel="nofollow">http://jsfiddle.net/smdvA/579/</a></p>