2 Replies Latest reply on Jun 8, 2010 5:57 PM by Edilmar Alves

    What's the better way to format masks/upper/etc?

    Edilmar Alves Expert

      Hi,

       

      I have used RichFaces3.3.3 in my JSF2 webapp, and now I would like to know what is the better way to do somethings like:

      - format masks in inputtexts and rich:calendars

      - convert string to upper/lower

      I have some old codes to do this manually with Javascript, but I would like to know if there is something more smart from RichFaces (or some partner) to standarize these things, disallowing these old and strange Javascript codes I used before.

       

      Thanks for any help.

        • 1. Re: What's the better way to format masks/upper/etc?
          Arief ZJ Newbie

          Hello,

           

          There a two jQuery plugin that can be used to implement this format masks.

           

           

          And there's a wiki page written for the meiomask plugin to work with RF:

          http://community.jboss.org/wiki/UsinginputmaskswithajQueryplugin

           

          Personally, i haven't try using them yet... maybe because in our application we need a more advanced input mask feature. So probably, we have to extend those library to cater our need.

           

          Hope that helps

          • 2. Re: What's the better way to format masks/upper/etc?
            Edilmar Alves Expert

            Hi,

             

            I tried masked-input-plugin with jQuery+JSF2+RichFaces 3.3.3, but it didn't work.

            This is my code:

             

            <a4j:form id="formCad">
              <!--<a4j:loadScript src="/js/jquery-1.4.2.min.js"/>-->
              <a4j:loadScript src="resource://jquery.js"/>
              <a4j:loadScript src="/js/jquery.maskedinput-1.2.2.min.js"/>
            
            <h:inputText id="cpf" value="12345678900" >
            <rich:jQuery selector="#form\\:cpf" query="alert('teste');mask('999.999.999-99')" timing="onload" />
            </h:inputText>
            
            </a4j:form>
            

             

            I tried with downloaded jquery-1.4.2 and with RichFaces internal jquery.js, but none works.

            I tried with simple selector="#cpf" too, and it didn't work.

            When I look at source code, the jquery.js is put into my html rendered page, like this:

             

            <script src="/sitesat2/a4j/g/3_3_3.Finalorg/richfaces/renderkit/html/scripts/jquery/jquery.js.jsf" type="text/javascript"></script>
            <script src="/sitesat2/a4j/g/3_3_3.Finalorg/richfaces/renderkit/html/scripts/JQuerySpinBtn.js.jsf" type="text/javascript"></script>
            
            <script src="/sitesat2/a4j/g/3_3_3.Finaljquery.js.jsf" type="text/javascript"></script>
            <script src="/sitesat2/js/jquery.maskedinput-1.2.2.min.js" type="text/javascript"></script>
            
            
            
            

             

            and all of these links, when I click, go to some JS code. Then, I think there is no problem with locating files into the hard disk.

             

            But the code to include a h:inputText ignores the rich:jQuery above. The code generated is:

             

            <form id="formCad" name="formCad" method="post" action="/sitesat2/cliente/consViagens.jsf">
            <!--<a4j:loadScript src="/js/jquery-1.4.2.min.js"/>-->
            <!--<a4j:loadScript src="/js/jquery.maskedinput-1.1.4.pack.js"/>-->
            <input id="formCad:cpf" type="text" name="formCad:cpf" value="12345678900" />
            ...
            </form>
            
            

             

            No JS to control the input is generated.

             

            I look at many sites and I think I made all right.

            The link http://docs.jboss.org/richfaces/latest_3_3_X/en/devguide/html/rich_jQuery.html also explain how to use this, and I didn't find anything wrong with my code...

             

            Thanks for any help.