Question

我正在使用django 3，并且正在使用评论系统

这就是我模板中的内容：

<!-- Add a Comment -->

<form method="post" class='my-ajax-form' data-url="{{ request.build_absolute_uri|safe }}" >
    {% csrf_token %}
    <div class="form-group">
        <textarea class="form-control" name="comment"  rows="3"></textarea>
    </div>
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

显示评论的地方

  <!-- Comments -->
{% for comment in post.comments.all %}
 <hr>
    {% if comment %}
        <div class="media mb-4">
            <img class="d-flex mr-3 rounded-circle profile-img" src="{{post.profile.img.url}}" >
            <div class="media-body">
                <strong>{{ comment.profile }}</strong>
                <div class="d-flex justify-content-between  flex-wrap">
                <p>{{ comment.text|linebreaks }}</p>
                {{ comment.created_date| date }}
                </div>
            </div>
        </div> 
    {% endif %}
    {% empty %}
        <p>No comments here yet :(</p>
        <hr>
{% endfor %}

这是ajax部分：

<!-- ajax part -->    
            {% block javascript %}
            <script>
            $(document).ready(function(){
                var $myForm = $('.my-ajax-form')
                $myForm.submit(function(event){
                    event.preventDefault()
                    var $formData = $(this).serialize()
                    var $thisURL = $myForm.attr('data-url') || window.location.href // or set your own url
                    $.ajax({
                        method: "POST",
                        url: $thisURL,
                        data: $formData,
                        success: handleFormSuccess,
                        error: handleFormError,
                    })
                })
            
                function handleFormSuccess(data){
                    console.log(data.message)
                    $myForm[0].reset(); // reset form data
                }
            
                function handleFormError(jqXHR, textStatus, errorThrown){
                    console.log(jqXHR)
                    console.log(textStatus)
                    console.log(errorThrown)
                }
            })
            
            </script>
            {% endblock javascript %}

当我在评论表单中写评论并提交时，该评论不会与其他评论一起显示，直到刷新页面为止，所以我想知道在提交后如何显示评论而不刷新页面

在不刷新的情况下更新表单下的数据-django

0 个答案: