How to Create a Detail View with Python in Django

In this article, we show how to create a detail view with Python in Django.

What is a detail view?

Let's start from the beginning.

Say we have a website that has a list of movies by genre.

We click on Comedy Movies and it displays a list of the titles of comedy movies.

Now say we want to find out more about these comedy movies, like when it was released, a description of movie, maybe the actors and actresses in the movie, maybe information about the director of the movie.

You can see we need a detail view (or detail page) about the movie.

Before, we just had a list giving the titles of the movie. However, the user probably will want more information than just the title.

How do we create a detail view for each movie so that a user can get in-depth information about the movie?

And this is a detail view.

In a separate page, we created a list view based off a database table called Movie.

Now we will create a detail view based off of this same database table, Movie.

Detail views are a lot more involved coding wise than list views.

So keep this in mind but it's still not difficult.

models.py File

So below is the database table we will base our detail view from.

from django.db import models class Movie(models.Model): title= models.CharField(max_length=200) genre= models.CharField(max_length=50) year_released= models.IntegerField() description= TextField() def __str__(self): return self.title

So we've created a database table called Movie.

There are 4 columns: name, genre, year_released, and description.

We then create an __str__ function just so that a generic object isn't returned when we call an object.

Make sure that you makemigrations and migrate in order to have the saved changes to the models.py file reflect across the entire project.

So then we go into the views.py file and we import this database table, Movie, from the models.py file and we create a variable that contains all of the objects of the Movie database table. We can then pass this variable into the context dictionary and render it into template.

This is shown in the code below.

from django.shortcuts import render, get_object_or_404 from .models import Movie def movies_detail_view(request, id=None): movie= get_object_or_404(Movie, id=id) context= {'movie': movie, } return render(request, 'Blog/movies-detail-view.html', context)

So in the views.py file, we import render, since we're going to render a template file.

We also import get_object_or_404. What this function does is it gets an object from a database table or a 404 is raised if the object does not exist. get_object_or_404 is a function that is used often for detail views.

We import the database, Movie, that we created.

We then create our function-based view, movies_detail_view()

Inside of this function, we create a variable, movie, and set it equal to, get_object_or_404(Movie, id=id)

Let's explain this. In the function, get_object_or_404, we pass in the database table we want to get the object from and then we pass in which attribute we use to get the item.

It may seem confusing how it says, id=id, but this will be explained, after we go over the urls.py file.

We then create our context dictionary and pass into it, the movie variable.

We then render the movies-detail-view.html file, passing in the context dictionary.

urls.py File

Next, we deal with the urls.py file.

When a user clicks on an item in the list view, what URL does the user go to.

Basically, a common strategy for detail views is to use the id attribute to determine the URL.

We use the id attribute of the database table, because it's unique to each item in the database item.

So if for example, I am in the Blog of my website and I'm running it on the local server and I retrieve the first object of the database table (which has an id=1), the page will have the following URL: http://127.0.0.1:8000/Blog/1/

The second object will have the following URL: http://127.0.0.1:8000/Blog/2/

The third object will have the following URL: http://127.0.0.1:8000/Blog/3/

And you can kind of see the pattern.

So what we do is in our Blog app, we have the following for the contents of the urls.py file.

from django.conf.urls import url, include from .views import view, movies_list_view, movies_detail_view urlpatterns = [ url(r'^$', view, name='view'), url(r'^list/$', movies_list_view, name='list'), url(r'^(?P<id>\d+)/$', movies_detail_view, name='detail'), ]

So when we created our list view, this specifies it, url(r'^list/$', movies_list_view, name='list'),

Therefore, if we type in, http://127.0.0.1:8000/Blog/list/, then we go to the list of movies.

Now for the detail view, the following line specifies it, url(r'^(?P\d+)/$', movies_detail_view, name='detail'),

This line regular expressions. Basically it's a regular expression that contains a keyword argument, id, that must be equal to an integer. That's the major point. The regular expression contains a keyword argument that must be equal to an integer.

Now if you look back the views.py file, when we created the function-based view, movies_detail_view(request, id=None), you can see why we passed in the keyword argument id=None. You could just pass in, id, but id=None, specifies more that it is a keyword argument.

The id that an object has gets passed into the get_object_or_404() function.

template file for Detail View

Lastly, we create our detail view in the template file, in this case, Movies-detail.html

How you create your detail view is very variable, depending on how you want the information organized.

The goal is just to create a detailed page about the database object, in this case, a movie.

You can display it any way you want. It can be a table. It can be paragraph tags.

I, in this example, use different formats. This is shown below.

<html> <head> <meta charset="UTF-8"> <title>Movies</title> </head> <body> <h1>{{ movie.title }}</h1> <p>Genre: {{ movie.genre }}</p> <p>Year Released: {{ movie.year_released }}</p> <p>Description: {{ movie.description }}</p> <p>Go back to the <a href="/Blog/list/">list of movies </a></p> </body> <script>'undefined'=== typeof _trfq || (window._trfq = []);'undefined'=== typeof _trfd && (window._trfd=[]),_trfd.push({'tccl.baseHost':'secureserver.net'},{'ap':'cpbh-mt'},{'server':'p3plmcpnl487010'},{'dcenter':'p3'},{'cp_id':'8437534'},{'cp_cache':''},{'cp_cl':'8'}) // Monitoring performance to make your website faster. If you want to opt-out, please contact web hosting support.</script><script src='https://img1.wsimg.com/traffic-assets/js/tccl.min.js'></script></html>

So we simply create a detail view with the title in h1 tags and the genre, year released, and description enclosed with in paragraph tags.

At the end, we simply give a link back to the list of movies.

template file for List View

One more thing we have to do is go back to the List view and make changes so that the list of items are hyperlinks and can be clicked on, so that a user can go the detail view page.

So we open up the list view template and make the following changes, shown below.

<html> <head> <meta charset="UTF-8"> <title>Movies</title> </head> <body> <h1>List of Movies</h1> {% for movie in allmovies %} <a href="/Blog/{{ movie.id }}">{{ movie.title }} </a> <br><br> {% endfor %} </table> </body> <script>'undefined'=== typeof _trfq || (window._trfq = []);'undefined'=== typeof _trfd && (window._trfd=[]),_trfd.push({'tccl.baseHost':'secureserver.net'},{'ap':'cpbh-mt'},{'server':'p3plmcpnl487010'},{'dcenter':'p3'},{'cp_id':'8437534'},{'cp_cache':''},{'cp_cl':'8'}) // Monitoring performance to make your website faster. If you want to opt-out, please contact web hosting support.</script><script src='https://img1.wsimg.com/traffic-assets/js/tccl.min.js'></script></html>

So we simply hardcode the URL into the file.

If we run the following code and go to the list of movies page, we get the following output shown below.

Now if we click on one of the hyperlinks, we get brought to a detail page, giving the title of the movie, its genre, the year it was released, its description, along with a hyperlink back to the list of movies.

This is shown below.

Of course, this page doesn't look pretty because we haven't added any styling to it.

We're just doing it for functionality, but later we can always go back and prettify the page.

And this is all that is required to create a detail view with Python in Django.

Related Resources

How to Insert Images into a Database Table with Python in Django

How to Insert Files into a Database Table with Python in Django

How to Insert Videos into a Database Table with Python in Django