FernandoPaiva
FernandoPaiva

Reputation: 4460

Change mask of a inputmask?

I'm trying change mask of <p:inputMask/> using JQuery. I have a <p:selectBooleanCheckbox/> that when is checked or unchecked does change the mask of inputMask.

jQuery

<script type="text/javascript">
            function setMask(){                       
                if($('check9').is(':checked')){
                    $('#telefone').prop('mask', '(99)9-9999-9999');
                }else{
                    $('#telefone').prop('mask', '(99)9999-9999');
                }

            }           
        </script>

Xhtml

<p:inputMask id="telefone" value="#{unidadeEscolarMB.telefone}" mask=""/>                   
                    <p:selectBooleanCheckbox itemLabel="Add9" onchange="setMask();" widgetVar="check9" id="ckbox9" value="true"/>

How I can do this ?

Upvotes: 0

Views: 2189

Answers (1)

FernandoPaiva
FernandoPaiva

Reputation: 4460

after 2 days looking for how to do this, now works.!

JavaScript

<script type="text/javascript">
            function setMaskTelefone(){
                var c = $(':checkbox[id*="checkBox"]'); 
                var t = PF('telefoneMask');             
                if(c.is(':checked')){                                   
                    t.jq.mask('(99)9-9999-9999');
                    t.jq.focus();
                }else{                              
                    t.jq.mask('(99)9999-9999');
                    t.jq.focus();
                }               

            }

        </script>

other way to do javascript, more clean

<script type="text/javascript">
            function setMaskTelefone(){
                var c = PF('ckbox9'); 
                var t = PF('telefoneMask');                         
                if(c.isChecked()){                                  
                    t.jq.mask('(99)9-9999-9999');
                    t.jq.focus();
                }else{                              
                    t.jq.mask('(99)9999-9999');
                    t.jq.focus();
                }               

            }

        </script>

Xhtml

<p:inputMask id="telefone" widgetVar="telefoneMask" value="#{unidadeEscolarMB.telefone}" mask="(99)9-9999-9999" />
<p:selectBooleanCheckbox itemLabel="Adiciona9" onchange="setMaskTelefone()" id="checkBox" widgetVar="ckbox9" value="true" immediate="true"/>

Upvotes: 1

Related Questions