Exercício – Implementar exibições genéricas para editar dados

Concluído

Para permitir que os usuários registrem novos cães em um abrigo, usaremos CreateView.

Atualizar o modelo para dar suporte a get_absolute_url

Vamos começar atualizando o modelo para dar suporte a get_absolute_url.

1. No Visual Studio Code, abra dog_shelters/models.py.

2. Adicione o código a seguir abaixo da linha que indica # TODO: Import reverse para importar a função reverse.

   # TODO: Import reverse
   from django.urls import reverse
   

3. Adicione o código a seguir à classe Dog imediatamente abaixo da linha que indica # TODO: Add get_absolute_url para ler o caminho de dog_detail de URLconf e transmitir a ID como o parâmetro.

       # TODO: Add get_absolute_url
       def get_absolute_url(self):
           return reverse('dog_detail', kwargs={"pk": self.pk})
   

Importante

Lembre-se de que o Python gerencia compartimentos com guias em vez de chaves ({ }). Devido a esse fato, get_absolute_url precisa estar no mesmo nível de guia que o comentário #TODO. Veja os arquivos no diretório da solução para ver o projeto concluído.

Criar DogCreateView

Vamos criar DogCreateView para permitir que alguém registre um cão.

1. No Visual Studio Code, abra dog_shelters/views.py.

2. Ao final de views.py, adicione o código a seguir para criar DogCreateView.

   class DogCreateView(generic.CreateView):
       model = models.Dog
       template_name = 'dog_form.html'
       fields = ['shelter', 'name', 'description']
   

Definimos o modelo como Dog, nosso modelo como dog_form.html e a lista de campos que desejamos que sejam editáveis.

Observação

A ordem na qual você listará os campos será a ordem em que eles serão exibidos no formulário.

Registrar a rota

Com a exibição criada, vamos registrar a rota na URLconf.

1. No Visual Studio Code, abra dog_shelters/urls.py.

2. Abaixo da linha que indica # TODO: Register create view, adicione o código a seguir para registrar a rota.

   # TODO: Register create view
   path('dog/register', views.DogCreateView.as_view(), name='dog_register'),
   

Criar o modelo HTML

Vamos criar o modelo para hospedar o formulário.

1. No Visual Studio Code, crie um arquivo dentro de dog_shelters/templates chamado dog_form.html.

2. Adicione o código a seguir a dog_form.html para criar o modelo que hospedará o formulário.

   {% extends 'base.html' %}
   
   {# TODO: Register crispy_forms_tags #}
   
   {% block title %}
   Register dog at shelter
   {% endblock %}
   
   {% block content %}
   <h2>Register dog at shelter</h2>
   <form method="POST">
       {% csrf_token %}
   
       {{ form.as_p }}
   
       <button type="submit" class="btn btn-primary">Save</button>
   </form>
   {% endblock %}
   

Observação

Estamos adicionando uma observação para que possamos adicionar uma biblioteca, o que faremos no próximo exercício.

Criar um link para a página de registro

Vamos criar um link na página de lista de abrigos, atualmente a home page do aplicativo, para a página de registro que criamos.

1. No Visual Studio Code, abra dog_shelters/templates/shelter_list.html.

2. Abaixo da linha que indica {# TODO: Add link to registration page #}, adicione o código a seguir para criar o link.

   {# TODO: Add link to registration page #}
   <div>
       <a href="{% url 'dog_register' %}">Register a dog available for adoption</a>
   </div>
   

Testar a página

Vamos ver a página em ação.

1. Salve todos os arquivos selecionando Arquivo>Salvar Tudo.

2. No navegador, acesse http://localhost:8000.

3. Selecione Registrar um cão disponível para adoção.

   Agora, você verá o formulário.

   

   Observe como a relação de chave estrangeira se torna uma lista suspensa.

4. Escolha um abrigo e adicione um nome e uma descrição para um cão.

5. Selecione Salvar.

   Agora você está redirecionado para a página de detalhes do seu cão.

Você acabou de criar um formulário de criação usando CreateView no Django.