Tutorial: Usando mascaras em Entrada de dados

Neste exemplo será desenvolvido um formulário utilizando máscaras de entrada personalizadas e rotina para validação de social security number usando ajax.

Criando um novo formulário

1. Crie uma nova aplicação do tipo formulário (simples) baseada na tabela Employees.

2. No menu de aplicação clique no item Select Fields.


3. Escolha os campos : EmployeeID, FirstName, Title, BirthDate, SSN e HomePhone.


Atribuindo Mascara de entrada aos campos SSN e HomePhone

4. No menu de aplicação acesse a pasta Fields e clique sobre o campo SSN.

5. Na propriedade Grid Mask adicione a seguinte mascara: ###-##-####


6. No menu de aplicação ainda na pasta Fields clique sobre o campo HomePhone.

7. Na propriedade Grid Mask adicione a seguinte máscara: (###) ### – ####;###-####


Você pode utilizar o ponto e virgula para inserir duas máscaras para um campo.

8. No menu de aplicação acesse a pasta Layout e clique no item Blocks.


9. Altere as propriedades Label para Add/Edit Employees, habilite a propriedade Display Label e altere a propriedade Label Position para Above.


Criando um metodo para validação de Social Security Number

10. No menu de aplicação acesse a pasta Programming e clique no item Libraries.


11. Acesse a guia de edição ScriptCase Libraries e habilite a library sc_ssn.php


12. Dentro da pasta Programming acesse a pasta Methods e clique no item New Method.


13. Na propriedade Name informe ValidateSSN e clique no botão Create.

14. Insira o código exibido na imagem abaixo:


Criando um evento Ajax para o campo SSN

15. No menu de aplicação acesse a pasta Ajax Events e clique no item New Ajax Events


16. Configure o evento de acordo com a imagem abaixo:


17. Insira na area de código do evento a seguinte linha:


Tutoriais na mesma categoria

Formulário com campos especiais

Neste exemplo, vamos mostrar como configurar alguns campos especiais no Scriptcase, na aplicação f...

Mestre-Detalhe (Único-para-Único)

Neste exemplo será desenvolvido uma aplicação Mestre/Detalhe completa, onde obteremos um formu...

Geração de PDF em Formulários

Neste exemplo veremos como configurar a aplicação de formulário para exibir o botão de impres...

Formulário com Responsividade Mobile

As aplicações agora têm adaptação à ambientes mobile, sendo assim, o usuário pode acessar ...

Comente este post