Olá desenvolvedores, estamos as voltas com a criação de mais uma página JSP para cadastrar o(s) telefone(s) de um dado usuário. Ainda estamos trabalhando no contexto da aplicação de cadastro de usuários que estamos desenvolvendo e continuamente aprimorando. No tutorial “CADASTRO DE TELEFONE | PARTE 1” começamos a construir a lógica do cadastro de telefone.

No tutorial mencionado, relembramos o conceito de cardinalidade, muito comum em desenvolvimento de sistemas. E tão comum quanto é o conceito de cardinalidade de um para muitos, assim representado 1:N. Dessa forma, em nossa aplicação temos que um usuário poderá estar relacionado a mais de um número de telefone, mas um número de telefone só poderá estar relacionado a um usuário.

Assim, criamos uma nova servlet para os telefones e precisamos também de uma tela de cadastro de telefone. É o que iremos trabalhar neste tutorial.

CRIANDO TELA DE CADASTRO DE TELEFONE

Para facilitar o desenvolvimento dessa tela de cadastro de telefones, vamos reaproveitar alguns elementos da tela de cadastro de usuários. Assim sendo, o primeiro item a ser reaproveitado é todo o head, desse modo copie-o e cole na sua página de cadastro de telefones. No cabeçalho a única alteração deverá ser feita na tag <title>.

<title>Cadastro de Telefones </title>

Manteremos também os links que nos permitirão voltar ou para a página acessoliberado.jsp ou index.jsp.

Abra uma tag form cujo método de envio será o post, o id será formUser, e importante, o form receberá também o método validarCampos();

A próxima linha receberá duas tags input do tipo texto para id e nome respectivamente. Note que a tag <td> recebe um User, para exibir o nome do usuário relacionado com o número de telefone. Em value, os parâmetros responsáveis por mostrar o id e o nome do usuário virão do método doGet da servlet.

Estes campos deverão ser apenas de leitura visto que são informativos, assim receberão o atributo readonly.

Ainda dentro da tabela implementaremos a parte editável deste cadastro de telefone, onde poderemos adicionar o número do telefone e selecionar o tipo.

E abaixo uma nova linha onde iremos inserir o botão para submeter o registro telefônico.

Logo abaixo do formulário implementaremos uma tabela para exibir os campos id, número do telefone, tipo e um botão de excluir.

A tabela implementará também um forEach que é uma tag de iteração, semelhante ao for, e que receberá em seu cabeçalho uma lista de telefones que será carregada do banco de dados.

E como a tag form, mencionada acima recebe retorna o método validarCampos(), então implementaremos a validação dos campos número e tipo.

EM POUCAS PALAVRAS

Esta é a implementação do lado do HTML do formulário de cadastro de telefones em JSP que irá fazer a requisição para a servlet salvarTelefones, e então exibir os dados. Você pode estilizá-la a sua maneira, mas ao reaproveitar a página de cadastroUsuario.jsp observe que conseguimos preservar todo o estilo CSS da página, e assim mantendo o padrão sem precisar reinventar a roda. Espero que tenham gostado, eu fico por aqui e nos vemos no próximo tutorial.