title: Uncaught TypeError: Cannot read property 'split' of undefined(anonymous function)
body: <p>I'm not sure why I'm getting this error, I'm simply trying to move the form that was working in index page to post page. I simply moved the form but not working; Uncaught TypeError: Cannot read property 'split' of undefined(anonymous function) for some reason. </p>
  
  <pre><code>            &lt;div&gt;
  
          {% crispy comment_form comment_form.helper %}
  
                  &lt;/div&gt;
  
  &lt;script&gt;
  $(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() + "&amp;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 + "see");
                }
             }  
  
          },
          error:function(response){
            alert("some error occured. see console for detail");
          }
        });
      });
  </code></pre>
  
  <p>my form</p>
  
  <pre><code>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', 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']))
  \
  </code></pre>
  
  <p>my view</p>
  
  <pre><code>  def comment_thread(request, id):
          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
          }
          return render(request, "comments/comment_thread.html", context)
  </code></pre>
  
  <p>Edit:</p>
  
  <pre><code>{% extends "base.html" %}
  {% load crispy_forms_tags %}
  
  {% block content %}
  
  &lt;a href="{{ comment.get_origin }}"&gt;Go Back&lt;/a&gt;
  
  &lt;table class='table'&gt;
  
  &lt;tr&gt;&lt;td&gt;{{ comment.get_comment }} 
  &lt;br/&gt;&lt;small&gt;via {{ comment.user }} | {{ comment.timestamp|timesince }} ago &lt;/small&gt;
                  {% if not comment.is_child %}
                  &lt;ul&gt;
                  {% for child in comment.get_children %}
                  &lt;li&gt;{{ child.get_comment }} 
                  &lt;small&gt;via {{ child.user }}&lt;/small&gt;
  
  
                  &lt;/li&gt;
                  {% endfor %}
                  &lt;/ul&gt;
                  &lt;div&gt;
  
          {% crispy comment_form comment_form.helper %}
  
                  &lt;/div&gt;
                  {% endif %}
  
  
  &lt;/td&gt;&lt;/tr&gt;
  
  
  &lt;/table&gt;
  
  &lt;script&gt;
  $(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() + "&amp;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");
          }
        });
      });
  </code></pre>