Tarea: Crea un modelo de comentarios
Actualmente, solamente tenemos un modelo de Post, ¿Qué si queremos recibir retro alimentación de tus lectores y dejarlos comentar?
Crea un modelo de comentarios para el blog
Vamos a abrir
blog/models.py y pega esta pieza de código al final del archivo:1
class Comment(models.Model):
2
post = models.ForeignKey('blog.Post', on_delete=models.CASCADE, related_name='comments')
3
author = models.CharField(max_length=200)
4
text = models.TextField()
5
created_date = models.DateTimeField(default=timezone.now)
6
approved_comment = models.BooleanField(default=False)
7
8
def approve(self):
9
self.approved_comment = True
10
self.save()
11
12
def __str__(self):
13
return self.text
Copied!
Puedes ir atrás al modelo Modelos en Django de este tutorial si necesitas refrescar lo que cada tipo de campo significa.
En esta extensión del tutorial vamos a tener un nuevo tipo de campo:
models.BooleanField- this is true/false field.
La opción
related_name en models.ForeignKey nos permite acceder acceso a los comentarios desde el modelo Post.Creando tablas para los modelos en tu base de datos.
Es tiempo de agregar nuestro modelo de comentarios a la base de datos. Para hacer esto le vamos a decir a Django que haga los cambios a nuestro modelo. Escribe
python manage.py makemigrations blog en tu linea de comendos. Deberías ver algo como esto:1
(myvenv) ~/djangogirls$ python manage.py makemigrations blog
2
Migrations for 'blog':
3
0002_comment.py:
4
- Create model Comment
Copied!
Como puedes ver, se ha creado otro archivo de migración en la carpeta
blog/migrations/. Ahora necesitamos aplicar estos cambios escribiendo python manage.py migrate blog en la línea de comandos. La salida debería verse así:1
(myvenv) ~/djangogirls$ python manage.py migrate blog
2
Operations to perform:
3
Apply all migrations: blog
4
Running migrations:
5
Rendering model states... DONE
6
Applying blog.0002_comment... OK
Copied!
¡Nuestro modelo de comentarios existe ahora en la base de datos! ¿No sería genial acceder a el desde nuestro panel de administración?
Registra el modelo de comentarios en el panel de administrador
Para registrar el modelo de Comentario en el panel de administrador, ve a
blog/admin.py y agrega esta línea:1
admin.site.register(Comment)
Copied!
Justo debajo de esta línea:
1
admin.site.register(Post)
Copied!
Recuerda que es importante importar el modelo de comentarios al comienzo del archivo, como esto:
1
from django.contrib import admin
2
from .models import Post, Comment
3
4
admin.site.register(Post)
5
admin.site.register(Comment)
Copied!
Si escribes
python manage.py runserver en la línea de comandos y vas a http://127.0.0.1:8000/admin/ en tu navegador, ahora podras acceder a la lista de comentarios, y también tendrás la posibilidad de agregar y eliminar comentarios. ¡Juega con la nueva característica de comentarios!Has tus comentarios visibles
Ve al archivo
blog/templates/blog/post_detail.html y agrega el siguiente código antes de la etiqueta `{% endblock %}`:
1
<hr>
2
3
<div data-gb-custom-block data-tag="for"></div>
4
5
<div class="comment">
6
<div class="date">{{ comment.created_date }}</div>
7
<strong>{{ comment.author }}</strong>
8
<p>{{ comment.text|linebreaks }}</p>
9
</div>
10
11
<div data-gb-custom-block data-tag="empty">
12
13
<p>No comments here yet :(</p>
14
15
</div>
Copied!
Ahora puedes ver la sección de comentarios en los detalles del post.
Pero puede verse un poco mejor, así que vamos a agregar algún css al final del archivo
static/css/blog.css:1
.comment {
2
margin: 20px 0px 20px 20px;
3
}
Copied!
También vamos a dejar a los visitantes sobre los comentarios que dejan en la página. Ve al archivo
blog/templates/blog/post_list.html y agrega una lína como esta:1
<a href="
2
3
<div data-gb-custom-block data-tag="url" data-0='post_detail'></div>
4
5
">Comments: {{ post.comments.count }}</a>
Copied!
Después de esto, tu plantilla debería verse así:
1
<div data-gb-custom-block data-tag="extends" data-0='blog/base.html'></div>
2
3
<div data-gb-custom-block data-tag="block"></div>
4
5
6
7
<div data-gb-custom-block data-tag="for"></div>
8
9
<div class="post">
10
<div class="date">
11
{{ post.published_date }}
12
</div>
13
<h1><a href="
14
15
<div data-gb-custom-block data-tag="url" data-0='post_detail'>">{{ post.title }}</a></h1>
16
<p>{{ post.text|linebreaksbr }}</p>
17
<a href="<div data-gb-custom-block data-tag="url" data-0='post_detail'>">Comments: {{ post.comments.count }}</a>
18
</div>
19
</div>
20
21
</div>
Copied!
Deja a tus lectores escribir comentarios
Ahora podemos ver los comentarios hechos en nuestro blog, pero no podemos agregarlos. ¡Vamos a cambiar eso!
Ve a
blog/forms.py y agrega las siguientes líneas al final del archivo:1
class CommentForm(forms.ModelForm):
2
3
class Meta:
4
model = Comment
5
fields = ('author', 'text',)
Copied!
Recuerda importar el modelo Comentario, cambiando la línea:
1
from .models import Post
Copied!
en:
1
from .models import Post, Comment
Copied!
Ahora vamos a
blog/templates/blog/post_detail.html y antes de la línea {% for comment in post.comments.all %}, agrega:1
<a class="btn btn-default" href="<div data-gb-custom-block data-tag="url" data-0='add_comment_to_post'></div>
2
3
">Add comment</a>
Copied!
Si quieres ir a los detalles del post, deberías ver este error:
NoReverseMatch
¡Ahora sabemos como arreglarlo! Ve a
blog/urls.py y agrega esto a urlpatterns:1
url(r'^post/(?P<pk>\d+)/comment/#x27;, views.add_comment_to_post, name='add_comment_to_post'),
Copied!
¡Refresca la página y ahora tenemos un erro diferente!
AttributeError
Para agregar este error, agrega esto a
blog/views.py:1
def add_comment_to_post(request, pk):
2
post = get_object_or_404(Post, pk=pk)
3
if request.method == "POST":
4
form = CommentForm(request.POST)
5
if form.is_valid():
6
comment = form.save(commit=False)
7
comment.post = post
8
comment.save()
9
return redirect('post_detail', pk=post.pk)
10
else:
11
form = CommentForm()
12
return render(request, 'blog/add_comment_to_post.html', {'form': form})
Copied!
Recuerda importar
CommentForm al comienzo del archivo:1
from .forms import PostForm, CommentForm
Copied!
Ahora vamos a los detalles de la página y deberíamos ver el botón "Add Comment":
AddComment
Sin embargo, cuando des click en el botón verás:
TemplateDoesNotExist
Como el error nos dice, la plantilla no existe aún. Entonces vamos a crear una en
blog/templates/blog/add_comment_to_post.html y agregar el siguiente código:1
<div data-gb-custom-block data-tag="extends" data-0='blog/base.html'></div>
2
3
<div data-gb-custom-block data-tag="block"></div>
4
5
<h1>New comment</h1>
6
<form method="POST" class="post-form">
7
8
<div data-gb-custom-block data-tag="csrf_token">
9
10
{{ form.as_p }}
11
<button type="submit" class="save btn btn-default">Send</button>
12
</form>
13
14
</div>
Copied!
¡Genial! !Ahora nuestroe lectores puede agregar lo que piensan en nuestros post!
Moderando los comentarios
No todos los comentarios deberían ser mostrados. Como dueño del blog, posiblemtente quieras la opción de aprovar o eliminar comentarios. Vamos a hacer algo sobre esto.
Ve a
blog/templates/blog/post_detail.html y cambia las líneas:1
<div data-gb-custom-block data-tag="for"></div>
2
3
<div class="comment">
4
<div class="date">{{ comment.created_date }}</div>
5
<strong>{{ comment.author }}</strong>
6
<p>{{ comment.text|linebreaks }}</p>
7
</div>
8
9
<div data-gb-custom-block data-tag="empty">
10
11
<p>No comments here yet :(</p>
12
13
</div>
Copied!
a:
1
<div data-gb-custom-block data-tag="for"></div>
2
3
4
5
<div data-gb-custom-block data-tag="if"></div>
6
7
<div class="comment">
8
<div class="date">
9
{{ comment.created_date }}
10
11
12
<div data-gb-custom-block data-tag="if"></div>
13
14
<a class="btn btn-default" href="
15
16
<div data-gb-custom-block data-tag="url" data-0='comment_remove'>"><span class="glyphicon glyphicon-remove"></span></a>
17
<a class="btn btn-default" href="<div data-gb-custom-block data-tag="url" data-0='comment_approve'>"><span class="glyphicon glyphicon-ok"></span></a>
18
</div>
19
20
</div>
21
<strong>{{ comment.author }}</strong>
22
<p>{{ comment.text|linebreaks }}</p>
23
</div>
24
25
26
</div>
27
28
<div data-gb-custom-block data-tag="empty">
29
30
<p>No comments here yet :(</p>
31
32
</div>
Copied!
Deberías ver un
NoReverseMatch, porque no hay ninguna URL que concuerde con comment_remove y comment_approve aúnPara arreglar este error, agregemos estas urls a
blog/urls.py:1
url(r'^comment/(?P<pk>\d+)/approve/#x27;, views.comment_approve, name='comment_approve'),
2
url(r'^comment/(?P<pk>\d+)/remove/#x27;, views.comment_remove, name='comment_remove'),
Copied!
Ahora debereias ver un
AttributeError. Para arreglar este error, agrega las siguiente vistas en blog/views.py:1
@login_required
2
def comment_approve(request, pk):
3
comment = get_object_or_404(Comment, pk=pk)
4
comment.approve()
5
return redirect('post_detail', pk=comment.post.pk)
6
7
@login_required
8
def comment_remove(request, pk):
9
comment = get_object_or_404(Comment, pk=pk)
10
comment.delete()
11
return redirect('post_detail', pk=comment.post.pk)
Copied!
Necesitas importar
Comment al comienzo del archivo:1
from .models import Post, Comment
Copied!
¡Todo funciona! Hay un pequeño cambio que podemos hacer. en nuestra página de lista -- debajo de posts -- actualmente vemos el número de los comentarios que el post ha recibifo. Vamos a cambiar esto para ver el número de comentarios aprobados.
Para arreglar esto, ve a
blog/templates/blog/post_list.html y cambia la línea:1
<a href="
2
3
<div data-gb-custom-block data-tag="url" data-0='post_detail'></div>">Comments: {{ post.comments.count }}</a>
Copied!
a:
1
<a href="<div data-gb-custom-block data-tag="url" data-0='post_detail'></div>">Comments: {{ post.approved_comments.count }}</a>
Copied!
finalmente, añade el método al modelo
Post en blog/models.py:1
def approved_comments(self):
2
return self.comments.filter(approved_comment=True)
Copied!
Ahora puedes ver la característica de comentarios finalizada ¡Felicitaciones! :-)
Last modified 2mo ago