Submit button not working when using form

Submit button not working when using form - Printable Version

+- Python Forum (https://python-forum.io)
+-- Forum: Python Coding (https://python-forum.io/forum-7.html)
+--- Forum: Web Scraping & Web Development (https://python-forum.io/forum-13.html)
+--- Thread: Submit button not working when using form (/thread-9677.html)

Submit button not working when using form - tuannv562 - Apr-23-2018

Hi all. I'm studying Django and i want to create a forum.
This is the html code code:

{% extends 'base.html' %}

{% load static %}
{% load crispy_forms_tags %}

{% block title %}Post a reply{% endblock %}

{% block stylesheet %}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">
{% endblock %}

{% block breadcrumb %}
<li class="breadcrumb-item"><a href="{% url 'home' %}">Boards</a></li>
<li class="breadcrumb-item"><a href="{% url 'topic_list' topic.board.pk %}">{{ topic.board.name }}</a></li>
<li class="breadcrumb-item"><a href="{% url 'post_list' topic.board.pk topic.pk %}">{{ topic.subject }}</a></li>
<li class="breadcrumb-item active">Post a reply</li>
{% endblock %}

{% block content %}

<form class="mb-5" method="post">
{% csrf_token %}
{{ form.as_p }}
<input class="btn btn-primary" type="submit" value="Post a reply">
</form>

{% for post in topic.get_last_ten_posts %}
<div class="card mb-2">
<div class="card-body p-3">
<div class="row mb-3">
<div class="col-6">
<strong class="text-muted">{{ post.created_by.username }}</strong>
</div>
<div class="col-6 text-right">
<small class="text-muted">{{ post.created_at }}</small>
</div>
</div>
{{ post.get_message_as_markdown }}
</div>
</div>
{% endfor %}

{% endblock %}

{% block javascript %}
<script src="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>
<script>
var simplemde = new SimpleMDE();
</script>
{% endblock %}

Here is the model:

class Post(TimestampedModel):
    message = models.CharField(max_length=4000)
    topic = models.ForeignKey(Topic, on_delete=models.CASCADE, related_name='posts')
    created_by = models.ForeignKey(User, on_delete=models.CASCADE, related_name='posts')
    last_updated_by = models.ForeignKey(User, on_delete=models.CASCADE, related_name='+')

    def __str__(self):
        truncated_msg = Truncator(self.message)
        return truncated_msg.chars(30)

    def get_message_as_markdown(self):
        return mark_safe(markdown(self.message, safe_mode='escape'))

If i using this view code:

class PostCreateView(LoginRequiredMixin, generic.CreateView):
    model = models.Post
    fields = ('message',)
    template_name = 'boards/reply_topic.html'

    def get_context_data(self, **kwargs):
        kwargs['topic'] = get_object_or_404(models.Topic,
                                            pk=self.kwargs.get('topic_pk'),
                                            board__pk=self.kwargs.get('board_pk'))
        return super().get_context_data(**kwargs)

    def get_success_url(self):
        return reverse_lazy('post_list', kwargs={'board_pk': self.kwargs.get('board_pk'),
                                                 'topic_pk': self.kwargs.get('topic_pk')})

    def form_valid(self, form):
        user = self.request.user
        topic = get_object_or_404(models.Topic,
                                  pk=self.kwargs.get('topic_pk'),
                                  board__pk=self.kwargs.get('board_pk'))
        post = form.instance
        post.topic = topic
        post.created_by = user
        post.last_updated_by = user
        post.save()
        return HttpResponseRedirect(self.get_success_url())

A new post will be created after i click submit (Post a reply) button and page will be redirected to get_success_url function (post_list)

But i want to add text editor when creating a new post using SimpleMDE() javascript library
I changed the view code for html:

class PostCreateView(LoginRequiredMixin, generic.CreateView):
    model = models.Post
    fields = ('message',)
    template_name = 'boards/reply_topic.html'

    def get_form(self, form_class=None):
        form = super().get_form(form_class)
        form.fields['message'].widget = forms.Textarea()
        return form

    def get_context_data(self, **kwargs):
        kwargs['topic'] = get_object_or_404(models.Topic,
                                            pk=self.kwargs.get('topic_pk'),
                                            board__pk=self.kwargs.get('board_pk'))
        return super().get_context_data(**kwargs)

    def get_success_url(self):
        return reverse_lazy('post_list', kwargs={'board_pk': self.kwargs.get('board_pk'),
                                                 'topic_pk': self.kwargs.get('topic_pk')})

    def form_valid(self, form):
        user = self.request.user
        topic = get_object_or_404(models.Topic,
                                  pk=self.kwargs.get('topic_pk'),
                                  board__pk=self.kwargs.get('board_pk'))
        post = form.instance
        post.topic = topic
        post.created_by = user
        post.last_updated_by = user
        post.save()
        return HttpResponseRedirect(self.get_success_url())

or using a form with code:

class NewPostForm(forms.ModelForm):
    class Meta:
        model = Post
        fields = ('message',)
        widgets = {'message': forms.Textarea()}

with view code:

class PostCreateView(LoginRequiredMixin, generic.CreateView):
    model = models.Post
    form_class = NewPostForm
    template_name = 'boards/reply_topic.html'

After changing the code, text editor is showed when creating a new post. But when a click submit (Post a reply) button, nothing happen. Post is not created when i click submit button and nothing happen when i click this button. no redirect to get_success_url page.
Here is full source code: Link to full source code

What should i do if i want to using text editor for this field?