Hi.

Check this tool Input Masks

Olá pereiragobatto,
Temos enfrentado este mesmo problema ao utilizar a plataforma outsystems, já tentamos utilizar os componentes Majora e Input Mask, eles funcionam razoavelmente bem em desktop (exceto para valores com mais de duas casas decimais) porém, em nossos testes, o mesmo não pode ser dito quando se trata de acesso via dispositivo móvel. A partir da versão 4.0 do Android algumas máscaras simplesmente não funcionam. Inclusive abrimos um tópico neste mesmo fórum a respeito e até o presente momento ninguém respondeu ( https://www.outsystems.com/forums/discussion/12066/set-input-mask/ )
Encontramos um plugin para jQuery cujas máscaras funcionam no Android 4.0 ou superior ( https://igorescobar.github.io/jQuery-Mask-Plugin/ ) , porém nos deparamos com o retrabalho de ter que reaplicar as máscaras a cada refresh, pois as mesmas se perdem.
 
Nosso time abriu um chamado junto ao suporte da outsystems e eles reconheceram que este problema existe, que não dão suporte aos mencionados componentes da Forge, pois são de responsabilidade de terceiros, que a plataforma não oferece nativamente nenhum recursos para aplicação de máscaras e afirmou que a solução está na adoção de bibliotecas de terceiros.
 
Fica aberta a discussão sobre a melhor forma da utilização de máscaras na plataforma outsystems, tendo em vista não só o uso da mesma em desktop, mas também acesso via dispositivos móveis. 

Olá Marcel Amorim, obrigado pelo seu retorno!
Eu encontrei esses 2 componentes tbm para instalar, mas como vou usar em dispositivos móveis já estou vendo que terei retrabalho ao reaplicar as máscaras! O que vc aconselha? deixar sem as máscaras e esperar por um retorno da outsystems? Se eu aplicar máscaras somente para CPF e TELEFONE usando esses componentes é possível? Caso sim, como faço pra usar? Importo o componente no outsystems e arrasto para minha webscreen??
Agradeço desde já...

Olá pereiragobatto,
Utilizar os componentes da forge é facil, contudo não irá funcionar no dispositivos androids a partir da versão 4.0, no iOS funciona sem problemas, não testei no windows phone. Deves avaliar se podes conviver com esta limitação. Na solução destes componentes que você baixa pela forge é mostrado como utilizá-los, muito fácil e prático.

Não acredito que no curto prazo a outystems irá oferecer máscaras nativamente na plataforma, pois se algo dessa natureza estivesse em desenvolvimento acredito que o suporte da mesma teria nos orientado esperar.

No momento estamos utilizando o plugin em jQuery para aplicar as máscaras que citei no post anterior, tem funcionado bem, mas com este retrabalho de ter que reaplicar as máscaras a cada referesh. Sua utização já é mais complexa, deves inserir o código javascript do plugin em um webblock, inserir este webblock no final da página ou na master-page (layout_normal) e utilizar jquery para aplicar as máscaras, conforme no exemplo do próprio site do plugin. Não é muito intuitivo, mas funciona.

É uma solução também deixar sem máscara e validar apenas no submit, porém queremos evitar que o usuário tenha o retrabalho de apenas ver o seu erro ao dar um submit, mas fica a critério de cada solução.

Não posso te dar uma solução defitiva porque também estamos nessa busca e acreditamos que uma solução nativa seria a melhor via, mas enquanto ela não vem iremos adotar bibliotecas de terceiros.

boa noite Marcel Amorim, vc poderia fazer uma demonstração de como usar esse plugin jQuery?

Bom dia,
Criei uma eSpace para tentar lhe ajudar. Veja se funciona.
Não é mais necessário reaplicar as máscaras a cada refresh, conseguimos contornar isso utilizando uma função jQuery da própria plataforma.

Boa noite, não entendi o que quer dizer quando vc fala em adicionar o webblock jQueryMask ao final de cada página! Obrigado!

Penso que o que o Marcel indica é que se quer utilizar as máscaras basta adicionar o web block jQueryMask no fim da página e aplicar a class CSS usando as extended properties. Alternativamente pode colocar o web block dentro de uma parte comum de todas as páginas como por exemplo o web block footer (atenção que se tiver popups estas não incluem este web block e neste caso terá de adicionar nessas páginas o web block da máscara)

Marcel,
Excelente contribuição! Sugestão, coloque as classes CSS no Style Sheet do web block, assim é possível aplicar as máscaras directamente na propriedade Style dos elementos. Depois só falta limpar e publicar no Forge ;)

Bom dia,
Isso mesmo André, deve-se colocar o webblock jQueryMask ao final da página ou de um web block comum a todas as páginas, aqui nós utilizamos o mesmo no LayoutLondon que adaptamos da plataforma para nossa necessidade.

Obrigado pelas contribuições e as levarei em conta 

ok pessoal, mto obrigado, eu adicionei o jQueryMask no meu WebBlock Footer do meu Layout SanFrancisco, no entanto como faço para usar as extended properties e aplicar essa class CSS?

Bom dia,
Isso vc pode ver no exemplo que enviei, basta clicar no widget (Cpf, telefone...) e ver nas propriedades.

Um pouco mais sobre extendend properties:
https://www.outsystems.com/help/servicestudio/6.0/Web_User_Interface/Extending_Properties.htm

ok deu certo, mto obrigado Marcel, aproveitando o assunto, tem como eu validar a mascara de cpf e cnpj no mesmo campo?  O que desejo com isso seria caso eu digitasse até 11 digitos ele entenderia a máscara de cpf , caso eu digitasse mais de 11 [14 digitos para cnpj] ele entenderia um cnpj. Queria fazer isso sem criar 2 campos [1 campo para cpf e outro para cnpj]

Bom dia,
Tem sim, é só aplicar a classe "cpfCnpj", caso a pessoa digite mais de 11 dígitos ele transforma a máscara para CNPJ.

Obrigado Marcel, valew msm!! :))