Usar JQuery Mask money no PrimeFaces

sebastiao fidencio

unread,

Sep 23, 2010, 10:52:47 AM9/23/10

to jav...@googlegroups.com

PessoaALL, eu uso JSF 1.2 + facelets + RichfFaces + mojarra 1.2. Estou usando a tag <rich:jquery> do richfaces para formatar o inputtext para receber valores monetarios. A principio, está funcionando perfeitamente no jsf 1.2, porém no jsf 2.0 não consigo fazer funcionar porque;

1. jsf 2 não funciona ainda redondo com richfaces, visto que a versão 4 está no forno ainda, e nem quero tentar usar rich3+ porquanto não 100% de compatibilidade, ex: tag f:ajax não funciona..

2. Optei em usar o primefaces como extensão padrão do mojarra 2, até porque os componentes são bem mais atraentes e possui algumas funcionalidades a mais que o richfaces. De posso disso, minha dúvida maior é que não consigo fazer o Jquery mask money funcionar com primefaces, ou seja, não quero usar usar rich:jquery até porque só funciona no mojarra 1.2.

existe uma forma de usar o jquery mask money sem o rich:jquery ? como faço isso?

att

fidêncio

Flavio Cysne

unread,

Sep 23, 2010, 11:57:59 AM9/23/10

to jav...@googlegroups.com

Fidêncio,

não sei como está o seu <head> na página, mas já verificou se o arquivo .js do jQuery está lá? tipo assim: <script type="text/javascript" src="jquery.js"/>

usando o jQuery puro seria algo como colocar no evento onblur ou onkeypress (depende do caso) do teu input o seguinte codigo: jQuery('#idUnicoDoMeuInput').maskMoney();, supondo que você esteja usando o jquery-maskmoney.

Espero ter ajudado.

Flávio Cysne

--
Você recebeu esta mensagem por que é membro do Google Group "Javasf".
http://groups.google.com/group/javasf

Conheça também:
- Grupo Java Brazil em http://groups.google.com/group/thejavabrazil

sebastiao fidencio

unread,

Sep 23, 2010, 4:01:27 PM9/23/10

to jav...@googlegroups.com

cara, eu usava o a4j:loadScript para carregar o arquivo, porém com essa tag html <scprit type> não funciona quando uso facelets isso no jsf 2. !!! ahh vc me deu uma idéia legal, esqueci.. posso utilzar a nova tag do jsf 2... h:outputScript para carregar o arquivo, porém minha duvida e só como aplicar o jquery no campo.. teria como vc postar um exemplo usando jquery puro sem rich:jquery...?

Flavio Cysne

unread,

Sep 23, 2010, 7:05:42 PM9/23/10

to jav...@googlegroups.com

Fidêncio,

    seria algo assim:

<h:inputText id="valorContrato" onkeypress="jQuery('#valorContrato').maskMoney();"/>

    apenas uma sugestão, caso vc não use o prependId="false" no seu h:form, a4j:form, p:form, qq-framwork:form, será necessário informar no seletor do jQuery o nome do form o que deixaria a linha acima assim:

<h:inputText id="valorContrato" onkeypress="jQuery('#meuForm:valorContrato').maskMoney();"/>

    para estes casos eu prefiro usar um seletor com uma classe CSS o que deixaria o código assim:

<h:inputText id="valorContrato" styleClass="valorContrato" onkeypress="jQuery('.valorContrato').maskMoney();"/>

Espero ter ajudado.

Flávio Cysne

sebastiao fidencio

unread,

Sep 24, 2010, 8:56:48 AM9/24/10

to jav...@googlegroups.com

Cara vou testar,.. e te dou um feedback, vlw mesmo, se esse negocio funcionar.,, estarei dando Adeus ao jsf 1.2 + rich 3...rsrs

sebastiao fidencio

unread,

Sep 24, 2010, 1:40:28 PM9/24/10

to jav...@googlegroups.com

Flávio Cysne, Massa..funciou dessa forma..

==================================================================
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>Cadastro de Pessoa</title>
        <h:outputScript name="jquery.maskedinput.js" library="jsmi" target="head"/>
        <h:outputScript name="jquery.maskMoney.js" library="jmoney" target="head"/>
        <h:outputScript name="jquery.js" library="j" target="head"/>


      <script src="jquery.js" type="text/javascript"></script>
      <script src="jquery.maskMoney.js" type="text/javascript"></script>
      <script src="jquery.maskedinput.js" type="text/javascript"></script>

        <script type="text/javascript">
             jQuery(function($){
             $(".dataNascimento").mask("99/99/99");
             $(".valor").maskMoney({symbol:"R$", decimal:",", thousands:"."});
             });
        </script>

    </h:head>
    <h:body>
        <h:form>
            <h:messages/>
            <div style="float: left;">
                <fieldset>
                    <legend>Cadastro de Pessoa</legend>

                    <h:panelGrid columns="2">
                        <h:outputLabel for="nome" value="Nome: "/>

                        <h:inputText id="nome" value="#{pessoaController.pessoa.nome}"
                                     maxlength="30"
                                     required="true"
                                     requiredMessage="O campo [Nome] é Obrigatório!"/>
                        <h:outputLabel for="email" value="Email: "/>
                        <h:inputText id="email" value="#{pessoaController.pessoa.email}"
                                     required="true"
                                     requiredMessage="O [email] é obrigatório!"
                                     autocomplete="on"
                                     />
                        <h:outputLabel for="valor" value="Valor: "/>
                        <h:inputText id="valor" styleClass="valor"/>

                        <h:outputLabel for="dataNascimento" value="Nascimento: "/>
                        <h:inputText id="dataNascimento" styleClass="dataNascimento"/>

                        <h:outputLabel for="endereco" value="Endereço: "/>
                        <h:inputText id="endereco" value="#{pessoaController.pessoa.endereco}"/>
                    </h:panelGrid>
                    <h:panelGrid columns="2">
                        <h:commandButton value="Cadastrar" action="#{pessoaController.adicionarPessoa}">

                        </h:commandButton>
                        <h:commandButton value="Limpar" type="reset">

                        </h:commandButton>
                    </h:panelGrid>
                </fieldset>
            </div>
        </h:form>
    </h:body>
</html>

================================================================

Reply all

Reply to author

Forward