Question

Django 1.10。

从DetailView我想通过ajax更新模型对象。好吧，模型对象已更新。但是ajax成功函数无法从post方法获取数据。我发生故障功能。

换句话说，在UpdateView中的Django中，我可以在form_valid中的断点处停止，控制它返回一个代码为200的HttpResponse。稍后如果我刷新包含详细信息的页面，我可以看到模型对象已经改变。

但是在调试js的In Chrome开发工具中，我发生了失败功能。并且jqXHR.status = 0，textStatus =＆＃34;错误＆＃34;，errorThrown =＆＃34;＆＃34;。

我准备了一个模拟我的真实情况： https://Kifsif@bitbucket.org/Kifsif/ajax_update.git

有一点不同：此UpdateView呈现general_detail.html。在现实生活中，它应该呈现partial_detail.html。嗯，这是ajax，我们不需要重新加载整个页面。

因此，此模拟呈现整个页面。这是什么意思？这意味着：

1）如果我在http://localhost:8000/1/detail中，按下AjaxEdit链接会导致我失败。不工作。在Chrome开发人员工具中，我发生了失败功能。

2）我返回http://localhost:8000/1/detail，按编辑。我发生在http://localhost:8000/1/edit。这是没有ajax的普通编辑。但视图是有组织的，以便呈现没有重定向的响应。因此，我保存了模型并保留在 http://localhost:8000/1/edit 中。我可以看到整个细节，好像我正在查看正确的DetailView的结果。有两个控制链接：Edit和AjaxEdit。 现在AjaxEdit开始工作。

换句话说，在http://localhost:8000/1/edit ajax工作时，http://localhost:8000/1/detail它没有。

我刚刚开始学习ajax。我无法应对这一点。我会说重定向可能会影响。但是没有重定向。

通过ajax我查询视图的get方法并获取正确的数据。与post相比有什么不同。

你能评论一下并帮助我突破。

views.py

class GeneralUpdate(UpdateView):
    model = General
    fields = ['char']

    def form_valid(self, form):
        self.object = form.save()
        return render(self.request, 'general/general_detail.html', {"object": self.object})

models.py

class General(models.Model):
    char = models.CharField(max_length=100)

    def get_absolute_url(self):
        return reverse("detail", kwargs={"pk": self.id})

urls.py

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^create$', GeneralCreate.as_view(), name="create"),
    url(r'^(?P<pk>\d+)/detail$', GeneralDetailView.as_view(), name="detail"),
    url(r'^(?P<pk>\d+)/edit$', GeneralUpdate.as_view(), name="edit"),
]

general_form.html

<form id="form" action="" method="post">{% csrf_token %}
    {{ form.as_p }}
    <input id="submit" type="submit" value="Save" />
</form>

general_detail.html

<p id="char">{{ object.char }}</p>

<a href="{% url "edit" object.id %}">Edit</a>
<a id="ajax_edit" href="javascript:void(0)">AjaxEdit</a>


<script   src="https://code.jquery.com/jquery-3.1.0.min.js"   integrity="sha256-cCueBR6CsyA4/9szpPfrX3s49M9vUU5BgtiJj06wt/s="   crossorigin="anonymous"></script>
<script>
    $( document ).ready(function() {
    var ajax_edit = $("#ajax_edit");
    var char = $("#char");

    function show_get(data){
        $(data).insertAfter(char);
        var submit_link = $("#submit");
        submit_link.click(post);
    }

    function show_post(data){
        debugger;
    }

    function failure(jqXHR, textStatus, errorThrown){
        debugger;
    }

    function post(){
        $.ajax({
                method: "post",
                data: $("form").serialize(),
                url: 'http://localhost:8000/2/edit',
                success: show_post,
                error: failure,
                }
        )
    }

    function get(){
        $.ajax({
                method: "get",
                url: 'http://localhost:8000/2/edit',
                success: show_get,
                }
        )
    }

    ajax_edit.click(get);

    });
</script>

Answer 1

如果我理解正确......

您点击AjaxEdit - 它会从UpdateView获取回复并将其直接加载到您的/detail页面。您在技术上仍然在detail页面上。
您在chrome dev中检查您的表单，并看到该表单action属性指向任何内容。
您点击Save，您的ajax请求会按计划更新数据。
然后默认提交，POST请求转到/detail网址，因为从技术上讲，您仍然在details page。
Django的DetailView禁止POST请求并以405 HTTP状态（不允许方法）启动它，在chrome检查器中检查它。

这是主要原因。

作为修复，您可以通过添加

$("#form").submit(function(event){
      event.preventDefault();
});

之前submit_link.click(post);

我可以使用/ edit中的ajax，但不能使用/ detail

1 个答案: