Question

我有一个页面，我在其中使用自动完成功能从数据库中获取酒店，然后尝试更新在django应用程序中找到的酒店，但由于在页面加载后试图从javascript执行原始django标签，我遇到了一个问题由jquery选择触发我现在使用的代码在这里

function updateContent(id, place){

var html_cont = '<div class="hotel{{place.id}} panel lastminute4"'+
         ' style="margin:10px; padding:10px; text-align:left; padding-bottom:0px;">'+
        ' {% with '+ id +'|get_hotel as sel_hotel %}'+
        ' <h5 style="font-weight:900; text-transform:uppercase;">{{sel_hotel.hotel_name}}</h5>'+
        ' {% with 4|get_rooms as hotel_rooms%}'+
        ' {% for room in hotel_rooms %}'+
        ' <h6>{{room.title}}  *ksh. <span style="color:green;">{{room.amount}}</span></h6>'+
        ' <button class="btn btn-default btn_minus" data-target="htl_{{place.id}}_{{room.id}}"'+
                'style="display:inline;" formtarget="cost_{{place.id}}_{{room.id}}">&minus; room</button>'+
        ' <input type="number" class="form-control" min="0" value="0" formtarget="{{room.amount}}"'+
               ' id="htl_{{place.id}}_{{room.id}}" readonly style="width:60px; background:white; display:inline;">'+
        '<button class="btn btn-default btn_add" data-target="htl_{{place.id}}_{{room.id}}"'+
                ' style="display:inline;" formtarget="cost_{{place.id}}_{{room.id}}">&plus; room</button>'+
         '<b id="cost_{{place.id}}_{{room.id}}" style="font-size:15px;"> = Ksh.0</b>'+
        '{% endfor %}'+
        '{% endwith %}'+
        '{% endwith %}'+
    '</div>';
    div_id = "#append_hotel"+ place;
    $(div_id).append(html_cont);
}

我希望将执行后的标签呈现到模板上，而不是带有大括号和％符号的原始django标签

Answer 1

感谢Daniel Roseman提出的Ajax想法，我设法通过调用ajax函数来获取一些htmnl模板，该模板使用内容进行了更新并将其附加到我想要的区域，从而做到了这一点我做了这样的django视图

def get_hotel(request,id, pk):
    place = Location.objects.get(id=id)
    hotel = Hotels.objects.get(id=id)

    context = {
        'rooms':hotel.rooms.all(),
        'hotel':hotel,
        'place':place,
    }
    html = render_to_string("home/hotel_rooms.html", context)
    return HttpResponse(html)

这是将内容更新到模板的视图。 home / hotel_rooms.html 然后，我使模板生效了

<div class="hotel{{place.id}} panel lastminute4"
     style="margin:10px; padding:10px; text-align:left; padding-bottom:0px;">
    <h5><a style="font-weight:900; text-transform:uppercase;" href="" data-toogle="tooltip">{{hotel.hotel_name}}</a>
    {% for room in rooms %}
    <h6>{{room.title}} *ksh. <span style="color:green;">{{room.amount}}</span></h6>
    <button class="btn btn-default btn_minus" data-target="htl_{{place.id}}_{{room.id}}"
            style="display:inline;" formtarget="cost_{{place.id}}_{{room.id}}">&minus; room
    </button>
    <input type="number" class="form-control" min="0" value="0" formtarget="{{room.amount}}"
           id="htl_{{place.id}}_{{room.id}}" readonly style="width:60px; background:white; display:inline;">
    <button class="btn btn-default btn_add" data-target="htl_{{place.id}}_{{room.id}}"
            style="display:inline;" formtarget="cost_{{place.id}}_{{room.id}}">&plus; room
    </button>
    <b id="cost_{{place.id}}_{{room.id}}" style="font-size:15px;"> = Ksh.0</b>
    {% endfor %}

</div>

然后在我的ajax中

function updateContent(id, pk){
    $.ajax({
        type: 'GET',
        url: '/get_hotel/' + id +'/'+ pk,
        data: id,
        datatype: "json",
        success: function(data){
             div_id = "#append_hotel"+ pk;
             $(div_id).append(data);
        },//success
        error: function(){
            console.logs("AJAX - failure.");
        }//error
    });

};

非常感谢您的工作，就像一个魅力

页面加载后是否有一种方法可以执行从外部javascript文件发送的django标签

1 个答案: