Django - 在表单提交时重新加载 div

Question

我正在尝试在提交表单时刷新 django 应用程序中的某个 div。

index.html

<div class="col-md-8" id="notesColumn">
  {% crispy note_form %}
  {% include 'item/item_notes.html' %}
</div>

item_notes.html

<div class="panel-group panel-group-simple m-b-0" id="notesList" aria-multiselectable="true" role="tablist">
    {% for note in object.itemnote_set.all reversed %}
        <div class="panel">
            <div class="panel-heading" id="noteHeading{{ forloop.counter }}" role="tab">
                <a class="panel-title collapsed" data-parent="#notesList"
                   data-toggle="collapse" href="#noteCollapse{{ forloop.counter }}"
                   aria-controls="noteCollapse{{ forloop.counter }}" aria-expanded="false">
                    <span class="tag tag-default">{{ note.owner.first_name }}</span>
                    {{ note.get_action_display|upper }}
                    <small class="panel-actions">{{ note.date_added }}</small>
                </a>
            </div>
            <div class="panel-collapse collapse" id="noteCollapse{{ forloop.counter }}"
                 aria-labelledby="noteHeading{{ forloop.counter }}" role="tabpanel" aria-expanded="false"
                 style="height: 0px;">
                <div class="panel-body">
                    {{ note.content }}
                </div>
            </div>
        </div>
    {% endfor %}
</div>

app.js（包含在 index.html 中）

$(document).ready(function () {
  $("#notesTab form").submit(function(event){
      event.preventDefault();

  $('#notesList').remove();

  $.ajax({
    url: "{% url item_notes %}",
    success: function(data){
      $('#notesColumn').html('data');
    }
  })
})

views.py

def item_notes(request):
  return render_to_response(request, 'candidate/candidate_notes.html')

urls.py

url(r'item/profile/(?P<pk>[0-9]+)/$', views.ItemProfile.as_view(), name='item_profile'),
  url(r'item/notes', views.item_notes, name='item_notes'),

我从 chrome 得到的错误是：

http://127.0.0.1:8000/crm/item/profile/45/%7B%%20url%20item_notes%20%%7D 
Failed to load resource: the server responded with a status of 404 (Not Found)

Answer 1

您不能在外部 JS 文件中使用 Django 模板标签 - Django 不会解析该文件，这就是为什么您可以看到文字标签附加到您的 Ajax URL 的原因。

您需要将该值设置为模板本身的内联脚本内的全局 JS var。

Answer 2

首先尝试使用绝对网址看看，是否是导致错误的网址：

  $.ajax({
    url: "item/notes",
    success: function(data){
      $('#notesColumn').html('data');
    }
  })

其次，为什么要 GET 笔记 URL？你不是为此使用'item_profile'吗？在这种情况下，请尝试获取该 URL：

  $.ajax({
    url: "item/profile/" + "{{ object.pk }}",
    success: function(data){
      $('#notesColumn').html('data');
    }
  })

第三，检查 JS 代码，$("#notesTab form").submit 缺少右括号。

第四，尝试转义网址。我不确定在 JS 中使用哪种方法，但是由于未转义的代码，我多次遇到这个问题。

这些只是我脑海中的一些提示。希望对您有所帮助。