只是尝试使用我在一个模板中使用的表单到另一个模板

win*_*xee 7 python django ajax jquery

所以我有这个评论表格在post.html中工作正常,现在我正在尝试在commentThread.html中使用它但我遇到了一些问题.(这已经困扰了我三天,任何帮助都将不胜感激)我会用我的代码解释一下

def post(request, slug):
        hotCat = Category.objects.get_hotCat()


        post = get_object_or_404(Post, slug=slug)
        post.views += 1  # increment the number of views
        post.save()      # and save it
        profile = post.moderator
        #path = request.get_full_path()
        #comments = Comment.objects.filter(path=path)
        comments_count = Comment.objects.filter(post=post).count()
        comments = post.commented_post.all()
        for c in comments:
                c.get_children()
        hidden_data = {
                    "post_id" : post.id,
                    "origin_path" : request.get_full_path,
                    "parent_id" : None
                }
        comment_form = CommentForm(hidden_data=hidden_data) 
        context_dict = {
            'post' :post,
            'hotCat' :hotCat,
            'comments' : comments,
            'comment_form':comment_form,
            'comments_count':comments_count,
            'profile' :profile,


        }
        return render(request, 'main/post.html', context_dict)
Run Code Online (Sandbox Code Playgroud)

以上是我对post.html的功能.在主目录中.现在继续评论目录,我将发表评论表

class CommentForm(forms.Form):
    comment = forms.CharField(
        widget=forms.Textarea(attrs={"placeholder": "leave"})
    )
    #hidden_field = forms.CharField(widget=forms.HiddenInput())

    def __init__(self, hidden_data=None, data=None, files=None, **kwargs):
        super(CommentForm, self).__init__(data, files, kwargs)
        self.helper = FormHelper()
        self.helper.form_show_labels = False
        self.helper.add_input(Submit('submit', 'leave', css_class='btn btn-default'))
        if hidden_data:
            self.helper.add_input(Hidden('post_id', hidden_data['post_id']))
            self.helper.add_input(Hidden('origin_path', hidden_data['origin_path']))
            if hidden_data.get('parent_id', None):
                self.helper.add_input(Hidden('parent_id', hidden_data['parent_id']))
Run Code Online (Sandbox Code Playgroud)

在评论目录中,这是我用于创建评论的views.py.它有两个部分,一个用于parent_comment,另一个用于回复parent_comment,我命名为child_comment.

现在在我的post.html中,我需要这两个功能.但是对于commentThread.html,显示了parent_comment,我想要一个允许用户回复parent_comment的表单.所以我在commentThread.html中需要的只是child_comment表单.

@csrf_exempt
def comment_create_view(request):
    if request.method == "POST" and request.user.is_authenticated():
        parent_id = request.POST.get('parent_id')
        post_id = request.POST.get("post_id")
        origin_path = request.POST.get("origin_path")
        try:
            post = Post.objects.get(id=post_id)
        except:
            response_dat = {"code":400,"message":"Post does not exists"}
            return JsonResponse(response_data)


        parent_comment = None
        if parent_id is not None:
            try:
                parent_comment = Comment.objects.get(id=parent_id)
            except:
                parent_comment = None

            if parent_comment is not None and parent_comment.post is not None:
                post = parent_comment.post

        form = CommentForm(data=request.POST)
        if form.is_valid():
            comment_text = form.cleaned_data['comment']
            if parent_comment is not None:
                # parent comments exists
                new_comment = Comment.objects.create_comment(
                    user=MyProfile.objects.get(user=request.user),
                    path=parent_comment.get_origin, 
                    text=comment_text,
                    post = post,
                    parent=parent_comment
                    )

                hidden_data = {
                    "post_id" : post.id,
                    "origin_path" : request.get_full_path,
                    "parent_id" : parent_comment.id
                }
                comment_form = CommentForm(hidden_data=hidden_data)
                html = render_to_string('main/child_comment.html', {'comment': [new_comment], 
                                        'user': request.user, 
                                        'comment_form':comment_form})
                response_data = {"status":200, "message":"abc~", 
                                                "comment":html, 
                                                'parent': True, 
                                                'parent_id': parent_comment.id,
                                                'comment_count': parent_comment.comment_count()}
                return JsonResponse(response_data)
            else:
                new_comment = Comment.objects.create_comment(
                    user=MyProfile.objects.get(user=request.user),
                    path=origin_path, 
                    text=comment_text,
                    post = post
                    )

                hidden_data = {
                    "post_id" : post.id,
                    "origin_path" : request.get_full_path,
                    "parent_id" : None
                }
                comment_form = CommentForm(hidden_data=hidden_data)
                html = render_to_string('main/parent_comment.html', {'comment': new_comment, 
                                        'user': request.user, 
                                        'comment_form':comment_form})
                response_data = {"status":200, "message":"abc~", "comment":html, 'parent': False}
                return JsonResponse(response_data)

        else:
            print str(form)
            messages.error(request, "There was an error with your comment.")
            response_data = {"status":400,"message":"There was an error with your comment."}
            return JsonResponse(response_data)

    else:
        raise Http404
Run Code Online (Sandbox Code Playgroud)

使用与post.html相同的方法,我为commentThread.html创建了视图,下面是我所做的,请让我知道我在这里做错了什么;

def comment_thread(request, id):
    hotCat = Category.objects.get_hotCat()

    comment = Comment.objects.get(id=id)
    comments = comment.post.commented_post.all()
    for c in comments:
            c.get_children()
    hidden_data = {
                "post_id" : comment.post.id,
                "origin_path" : request.get_full_path,
                "parent_id" : None
            }
    comment_form = CommentForm(hidden_data=hidden_data) 
    context = {
    "comment": comment,
    'comment_form':comment_form,
    "hotCat":hotCat
    }
    return render(request, "comments/comment_thread.html", context)
Run Code Online (Sandbox Code Playgroud)

在post.html中,为了显示评论,我有三个模板.post.html,parent_comment.html和child_comment.html.我也会把它们发布在这里.

在post.html中

{% if user.is_authenticated %}

<!-- <form method="POST" id="commentForAjax" class='form-comment'>{% csrf_token %}

<input type='hidden' name='post_id' value='{{ post.id }}'/>
<input type='hidden' name='origin_path' value='{{ request.get_full_path }}'/> -->

{% crispy comment_form comment_form.helper %}
<!-- </form> -->

{% endif %}


 <div class="comment_bottom" style="padding:3px;">
{% if user.is_authenticated %}
<div class="make_reply">
    <a href='#' class='reply_btn'>reply</a>
        <div class='reply_comment'>

        <!-- <form method="POST" id="childCommentForAjax" class='form-comment'>{% csrf_token %}
        <input type='hidden' name='post_id' id='post_id' value='{{ post.id }}'/>
        <input type='hidden' name='origin_path' id='origin_path' value='{{ request.get_full_path }}'/>
        <input type='hidden' name='parent_id' id='parent_id' value='{{ comment.id }}' /> -->

        {% crispy comment_form comment_form.helper %}
        <!-- </form> -->
        </div>
    </div>
{% endif %}

<script>
$(document).ready(function() {


     $(document).on('submit', 'form', function(e){
      e.preventDefault();
      if($(this).parents("tr").length != 0) {
        parent_id = $(this).parents("tr").attr("id").split("_")[1];
        data_str = $(this).serialize() + "&parent_id=" + parent_id;
      } else {
        data_str = $(this).serialize();
      }
      $.ajax({
        type:'POST',
        url:'/comment/create/',  // make sure , you are calling currect url
        data:data_str,
        success:function(json){              
          alert(json.message); 
          if(json.status==200){
             var comment = json.comment.trim();
             var user = json.user;
             /// set `comment` and `user` using jquery to some element
              if(!json.parent) {
                $(comment).insertBefore('.table tr:first');
              }
              else {
                $(comment).insertBefore('#comment_' + json.parent_id + ' #child_comment:first');
                $(".replies").text("reply" + json.comment_count + "view all");
              }
           }  

        },
        error:function(response){
          alert("some error occured. see console for detail");
        }
      });
    });


$('#comment-post-form').on('submit', function(event){
    event.preventDefault();
    console.log("form submitted!");  // sanity check
    create_post();
});

</script>
Run Code Online (Sandbox Code Playgroud)

对于下面的ajax是我的parent_comment.html

{% load crispy_forms_tags %}

<tr id="comment_{{ comment.id }}">
  <td>
    <div class="row">
      <div class="col-sm-1">
   <a href="{% url 'userena_profile_detail' comment.user.user %}"><img src="{{ comment.user.get_mugshot_url }}" height='48' width='48' /></a>
      </div>
      <div class="col-sm-11">
        <div class="row">
          <div class="col-sm-12">
            <p> <a href="{% url 'userena_profile_detail' comment.user.user %}" style="padding:5px;">{{ comment.user.user }}</a>| <small>{{ comment.timestamp|timesince }} </small></p>

          </div>
        </div>
        <div class="row">
  <span style="margin:5px; word-break: break-all;">
    {{ comment.get_comment }}
</span>

        </div>
      </div>
    </div>

  <div class="comment_bottom" style="padding:3px;">
{% if user.is_authenticated %}
<div class="make_reply">
    <a href='#' class='reply_btn'>reply</a>
        <div class='reply_comment'>

        <form id="childCommentForAjax" method="POST">{% csrf_token %}
        <input type='hidden' name='post_id' id='post_id' value='{{ post.id }}'/>
        <input type='hidden' name='origin_path' id='origin_path' value='{{ comment.get_origin }}'/>
        <input type='hidden' name='parent_id' id='parent_id' value='{{ comment.id }}' />
        {% crispy comment_form comment_form.helper %}

        </form>
        </div>
    </div>
{% endif %}


    <div class="replyInfo">
    {% if not comment.is_child %}
        <div class="wholeReply">
          {% if comment.comment_count %}
        <a href='#' class='replies'>           
         {{comment.comment_count}}</a>
          {% endif %}

  <div class="got_replies">
        <ul id="child_comment" style="list-style-type: none;">
        {% for child in comment.get_children %}
<hr>        
        <li>
          <div class="row">
            <div class="col-sm-1">
 <a href="{% url 'userena_profile_detail' child.user.user %}" style="float:left;"><img src="{{ child.user.get_mugshot_url }}" height='48' width='48'/></a>              
            </div>
            <div class="col-sm-11">
              <div class="row">
                <div class="col-sm-12">
                  <p><a href="{% url 'userena_profile_detail' child.user.user %}" style="float:left;">&nbsp; {{ child.user.user }}</a>| <small>{{ comment.timestamp|timesince }}  </small></p>
                </div>
              </div>
              <div class="row">
                <div class="col-sm-12">
                     <span style="word-break: break-all; margin:5px;">
    {{ child.get_comment }}</span> 
                </div>
              </div>
            </div>
          </div>
        </li>
        {% endfor %}
      </ul>
    </div>





    </div>
  </div>
</div>
</div>
</div>
        {% endif %}


</td></tr>
Run Code Online (Sandbox Code Playgroud)

以下是我的child.html

{% load crispy_forms_tags %}

<ul id="child_comment" style="list-style-type: none;">
        {% for child in comment %}
<hr>        
        <li>
          <div class="row">
            <div class="col-sm-1">
 <a href="{% url 'userena_profile_detail' child.user.user %}" style="float:left;"><img src="{{ child.user.get_mugshot_url }}" height='48' width='48'/></a>              
            </div>
            <div class="col-sm-11">
              <div class="row">
                <div class="col-sm-12">
                  <p><a href="{% url 'userena_profile_detail' child.user.user %}" style="float:left;">&nbsp; {{ child.user.user }}</a>| <small>{{ child.timestamp|timesince }} </small></p>
                </div>
              </div>
              <div class="row">
                <div class="col-sm-12">
                     <span style="word-break: break-all; margin:5px;">
    {{ child.get_comment }}</span> 
                </div>
              </div>
            </div>
          </div>
        </li>
        {% endfor %}
      </ul>
Run Code Online (Sandbox Code Playgroud)

所以在commentThread.html中,我所做的就是表格

<div>
{% crispy comment_form comment_form.helper %}

</div>
Run Code Online (Sandbox Code Playgroud)

我尝试将相同的ajax功能放在那里,但没有区别..

==>页面刷新而不更改任何内容...显示没有错误它只是刷新...没有数据保存....]]

有人可以帮帮我吗?我试着尽可能详细

Ami*_*wal 2

将表单包含<form></form> 在 html 中的标记内,就像在parent_comment.html 中所做的那样。并<script>在 commentThread.html 中使用 post.html 块。问题似乎是由于 commentThread.html 中缺少表单元素所致