Problem with coin mask on Primefaces

Asked

Viewed 1,203 times

1

I’m using JSF, and it’s not working my coin mask, did I miss some of the code?

here is the code below

<!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:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">


<h:head>

    <title><ui:insert name="titulo">Sistema de Pedido de Venda</ui:insert></title>
    <h:outputStylesheet library="css" name="sistema.css" />
    <h:outputStylesheet library="js" name="jquery.maskMoney.js" />
</h:head>

<h:body>
    <p:ajaxStatus styleClass="ajax-status" onsuccess="configurarMoeda()">
        <f:facet name="start">
            <h:graphicImage library="images" name="loading.gif" />
        </f:facet>
        <f:facet name="complete">
            <h:outputText value="" />
        </f:facet>

    </p:ajaxStatus>



    <header>
    <div>
        <h:link>
            <h:graphicImage library="images" name="logo-algaworks.png" />
        </h:link>
    </div>
    </header>

    <div id="conteudo">
        <ui:insert name="corpo" />
    </div>

    <p:separator style="margin-top:20px" />

    <footer> Rodape </footer>

</h:body>



<script>
    function configurarMoeda() {
        $(".moeda").maskMoney({
            decimal : ",",
            thousands : ".",
            allowZero : true
        });
    }

    $(document).ready(function() {
        configurarMoeda();
    });
</script>

</html>

this is the page

<ui:composition template="/WEB-INF/template/LayoutPadrao.xhtml"
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">

    <ui:define name="titulo">Novo Produto</ui:define>
    <ui:define name="corpo">
        <h1>Novo Produto</h1>
        <p:toolbar style="margin-top:20px">
            <p:toolbarGroup>
                <p:button value="Novo" outcome="/produtos/CadastroProduto" />
                <p:commandButton value="Salvar" id="botaoSalvar" />
            </p:toolbarGroup>
            <p:toolbarGroup align="right">
                <p:button value="Pesquisa" />
            </p:toolbarGroup>
        </p:toolbar>
        <p:panelGrid columns="2" id="painel"
            style="width:100%; margin-top:20px">

            <p:outputLabel value="SKU" for="sku" />
            <p:inputText id="sku" size="20" maxlength="20" />

            <p:outputLabel value="Nome" for="nome" />
            <p:inputText id="nome" size="80" maxlength="80" />

            <p:outputLabel value="Categoria" for="categoria"/>
            <p:selectOneMenu id="categoria">
            <f:selectItem itemLabel="Selecione a Categoria"/>
            </p:selectOneMenu>

            <p:outputLabel value="SubCategoria" for="subcategoria"/>
            <p:selectOneMenu id="subcategoria">
            <f:selectItem itemLabel="Selecione a SubCategoria"/>
            </p:selectOneMenu>


            <p:outputLabel value="Valor unitário" for="valorUnitario"/>
            <p:inputText id="valorUnitario" size="10" maxlength="10" styleClass="moeda"/>



            <p:outputLabel value="Estoque" for="estoque" />
            <p:inputText id="estoque" size="10" maxlength="10" />



        </p:panelGrid>

    </ui:define>

</ui:composition>

I’m following this link

https://github.com/algaworks/curso-javaee-primefaces/tree/master/ConfigurandoMascaraDinheiroJQuery

  • my goal is to implement jquery to learning purposes.

1 answer

1

The error is found in this code snippet.

Before

<title><ui:insert name="titulo">Sistema de Pedido de Venda</ui:insert></title>
    <h:outputStylesheet library="css" name="sistema.css" />
    <h:outputStylesheet library="js" name="jquery.maskMoney.js" />
</h:head>

Afterward

<h:head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title><ui:insert name="titulo">Sistema de Pedidos de Venda</ui:insert></title>
    <h:outputStylesheet library="css" name="sistema.css" />
    <h:outputScript library="js" name="jquery.maskMoney.js"/>
</h:head>

Just needed a little attention

<h:outputScript library="js" name="jquery.maskMoney.js"/>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.