Páginas Web e Modais
Como criar novas páginas e janelas modais em aplicações web
O passo mais importante na criação da maioria das aplicações web é a organização do seu trabalho com a base de dados. Como obter dados da base de dados, como exibi-los no ecrã do utilizador, e como gerir e apagar esses dados.
É a estas questões que o novo módulo é naturalmente dedicado. No terceiro módulo, criámos uma base de dados e concebemos modelos para registar informações sobre cidades e países. Agora vamos organizar o trabalho com esta base de dados. Temos de fazer o seguinte:
- Criar uma tabela para produzir informação a partir da base de dados
- Aprender a adicionar dados à base de dados, bem como a eliminá-los
- Aprenda como funcionam as janelas modais para criar uma interface de fácil utilização
- Compreender como funcionam as tabelas ligadas
Páginas
Comecemos com a parte preparatória. A nossa aplicação está a ficar maior, e está apertada numa página. Precisamos de criar pelo menos mais uma. Vamos acrescentá-la ao menu da esquerda.
Vamos chamar a página criada de "World" e definir o ícone e um URL claro.
Janelas modais
Precisamos da capacidade de acrescentar novos países na página criada. Para tal, precisamos de uma janela modal na qual introduza os dados necessários e um botão que abra esta janela modal.
A janela modal é uma componente especial. Não ocupa qualquer lugar específico na página e, ao mesmo tempo, combina as propriedades do componente (com configurações específicas dos componentes) e a nova página (com a sua própria tela para adicionar outros componentes). O local mais apropriado para colocar um modal é na área no fundo da página. É destacado a verde, tal como o próprio componente modal.
É necessário dar-lhe um nome adequado, e ao premir o botão, atribuir-lhe uma acção simples - exibir esta janela modal.
O passo seguinte é introduzir os dados necessários. Já fizemos uma operação semelhante no módulo anterior quando passámos o valor de X e Y. Agora precisamos de fazer a mesma coisa, excepto que o tipo de dados é diferente, e os campos de entrada estão numa janela modal.
A base de dados regista a informação mais básica sobre os países. Este é o seu nome (String tipo) e descrição geral (Text). Estes são os campos de entrada que precisa de adicionar.