Question

我一直有这个问题。但我无法想象如何做到这一点。有没有办法，我们可以使用模板语言的javascript对象。例如，我有一个在选择小部件上呈现的类别的查询集。

Category: <select name="category" id="id_category">
{% for category in categories %}
<option value="{{category.id}}">{{category.name}}</option>
{% endfor %}
</select>

现在，对于所选类别，我异步调用服务器以返回相关的产品类型。

$('#id_category').change(function(){
    getProductTypes($(this).val());

});

在ajax函数中，我无法在url模板标记中使用category_id js对象。因此，我必须硬编码目标网址。任何人都可以建议一种方法来处理这个问题。谢谢

function getProductTypes(category_id){
         //Would like to do this
           var url = {% url lookup_product_types category_id %}
         //But end up doing this
           var url = '/'+category_id+'/product_types/find/'
              $.ajax({
                url:url,
                data:{category:category_id},
                dataType:'json',
                success: function(data, status, xhr){
                    html = '<select>';
                    $.each(data, function(index, value){
                        html += '<option value='+this.pk+'>'+this.fields.name+'</option>';
                    });
                    html += '</select>';
                    $('#productType').html(html);
                }  
              });

Answer 1

如何在选项标签上使用data attribute？

您可以将模板更新为 -

{% for category in categories %}
    <option data-url="{% url lookup_product_types category.id %}" value="{{category.id}}">{{category.name}}</option>
{% endfor %}

然后沿着 -

的方向更改ajax

$('#id_category').change(function(){
    var url = $(this).find('option:selected').attr('data-url');
    getProductTypes($(this).val(), url);
});

function getProductTypes(category_id, url){
    $.ajax({
        url: url,
        data:{ category:category_id},
        // ..

Django：用户Javascript对象作为上下文变量

1 个答案: