【问题标题】:append a django template include with jquery用 jquery 附加一个 django 模板包含
【发布时间】:2025-12-20 21:40:07
【问题描述】:

我想在一个 jquery 帖子之后将以下 django 模板包含(它是一个列表项)添加到一个名为 myClass 的 UL 中:

 $.post(url,data,function(result){
        $( ".myClass" ).append('{% include "mytemplate.html" %}');
        })

这会导致重新加载页面的错误。

我已阅读有关 jquery 加载的信息,这听起来很有希望。无论哪种方式,我如何添加列表项?

【问题讨论】:

  • 这样做的一个选项是,在view 中,您将返回呈现的template 并将result 附加到div
  • 我在上面的评论中做了一个例子,看我的回答:D

标签: jquery django django-templates


【解决方案1】:

不可能做到$( ".myClass" ).append('{% include "mytemplate.html" %}');

一种可能的方式是:

<form action="#" method="post" id="testForm">     
    <input type="text" name="tester" value="">        
    <input type="submit" value="save" />
</form>
<div class="myClass"></div>

脚本

$("#testForm").on("submit", function(event){    
    $.post('url', $(this).serialize(),
    function(data){
        CreateRow(data);
    }, "json"); 
    event.preventDefault(); 
});

function CreateRow(dd){
    $(".myClass").append(dd.mycontent);
}

views.py 用于 url

import json
from django.views.decorators.csrf import csrf_exempt

@csrf_exempt
def testpost(request):
    str_html="""
    <h1>....</h1>...your full htmlcode
    """       
    return HttpResponse(json.dumps({"mycontent": str_html}), mimetype="application/json")

【讨论】:

    【解决方案2】:

    最相似的方法是在view 中返回template 已经rendered,例如你有一个名为to_include.html 的模板:

    模板to_include.html

    <p>{{variable}}</p>
    

    网址

    url(r'^some_view/$', some_view),
    

    POST 请求(在您将包含to_include.html 的模板中)

     $.post('/some_view/',data,function(result){
            $( ".myClass" ).append(result);
            }, 'html');
    

    观点

    def some_view(request):
        variable = "Hi I am an example"
        return render(request, 'to_include.html', {'variable': variable})
    

    逻辑是viewsome_view)将templateto_include.html)已经rendered返回给POST request

        <p>Hi I am an example</p>
    

    所以result 将是template 已经rendered 和:

    $( ".myClass" ).append(result);
    

    真的是:

    $( ".myClass" ).append("<p>Hi I am an example</p>");
    

    【讨论】: