Reputation: 4460
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
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