Tutorial: Formulário com Labels abaixo dos campos


Nesse tutorial, será criado um Formulário com Labels abaixo dos campos utilizando a tabela de exemplo “employees” e os seguintes recursos extras:

  • Blocos.
  • Páginas.

Criando um Formulário com Labels abaixo dos campos

Nota:

Caso tenha alguma dúvida de como criar um Formulário, acesse: Criando um novo Formulário


1. Crie uma nova aplicação do tipo Formulário, selecione a opção “Único Registro” e em seguida, selecione a tabela de exemplo “employees”.


2. Feito isso, caso deseje uma melhor exibição do formulário, clique na aba “Editar Campos” e altere o nome dos campos destacados, conforme é mostrado nas imagens abaixo.

Editando os campos do Formulário com Labels abaixo dos campos


1. Primeiro, no menu da aplicação, acesse a aba “Layout” e selecione a opção “Páginas”.


2. Feito isso, renomeia a página já existente para “Informações Pessoais”, crie uma nova página, denominada “Anotações”, e em seguida, clique no botão “Incluir” como mostra a imagem abaixo.


3. Agora, ainda na aba de “Layout”, selecione a opção “Blocos”.


4. Feito isso, renomeie o bloco já existente para “Informações Pessoais” e configure o mesmo de acordo com a imagem abaixo.


5. Ainda nas configurações dos blocos, clique no botão “Criar Novo Bloco” e crie um novo bloco intitulados “Endereço”.

6. Após criar o bloco “Endereço”, crie mais um bloco intitulado “Anotações”.


6. Agora, posicione o bloco “Endereço” na “Pag1” e o configure de acordo com a imagem abaixo.


7. Após configurar o bloco anterior, configure o bloco “Anotações” de acordo com a imagem abaixo e mantenha o mesmo na “Pag2”.


8. Feito isso, no menu da aplicação, acesse a aba “Posicionamento dos Campos”.


9. Agora, mova os campos: “employeeid”, “titleofcourtesy”, “homephone”, “photo”, “reportsto”, “photopath” e “extension” para a caixa da esquerda, conforme é mostrado abaixo.


10. Em seguida, organize os campos em seus respectivos blocos e páginas, como mostra a imagem abaixo.


11. Finalmente, selecione o botão “Executar Aplicação” na barra de ferramentas para gerar o Formulário.


Feito isso, após seguir os passos acima, o Formulário ficará desta forma:


Para ver mais exemplos criados usando o Scriptcase, acesse: Exemplos: Sistemas Completos e Aplicações com Scriptcase.

Tutoriais na mesma categoria

Campo Avaliação

Neste tutorial, será criado um Formulário utilizando os campos de avaliações. Criando o Form...

Formulário Multi-Etapas

Neste tutorial veremos  como criar um formulário multi-etapas, deixando o formulário mais agradá...

Nova opção de Marca d’água

Nova opção para exibir a marca d'água do campo de data dentro do input, disponível para Formul...

Gerenciamento de Arquivos na Nuvem

Alguns dos serviços de armazenamento de dados estão prontos para ler e armazenar com segurança ...

Comente este post