如何使用Django模板在javascript中访问ajax jquery中的模板变量

Posted 2023-05-08

【中文标题】如何使用Django模板在javascript中访问ajax jquery中的模板变量

【英文标题】：how to access template variables in ajax jquery in javascript using Django template

【发布时间】：2021-12-11 17:01:24

【问题描述】：

我有一个包含 ajax jquery 的 javascript，它根据返回的数据刷新模板，如下所示 -

product-filter.js 在代码下方

$(document).ready(function()
    $(".ajaxLoader").hide();
    $(".filter-checkbox").on('click',function()
        var _filterObj=;
        $(".filter-checkbox").each(function(index,ele)
            var _filterVal=$(this).val();
            var _filterKey=$(this).data('filter');
            _filterObj[_filterKey]=Array.from(document.querySelectorAll('input[data-filter='+_filterKey+']:checked')).map(function(el)
                return el.value;
            );
        );
        //Run Ajax
        $.ajax(
            url:'/filter-data_b/1',
            data: _filterObj,
            dataType: 'json',
            beforeSend: function()
                $(".ajaxLoader").hide();
            ,
            success:function(res)
                console.log(res);
                $("#filteredProducts_b").html(res.data);
                $(".ajaxLoader").hide();
            
        )
    );

我可以使用 /filter-data_b/1 来实现它，其中 1 是硬编码的brand_id，我想知道如何从调用 product-filter.js 的模板中获取它 views.py和urls.py中的/filter-data_b/1代码如下所示

urls.py

urlpatterns = [
    path('', views.home,name='home'),
    path('brand_product_list/<int:brand_id>', views.brand_product_list,name='brand_product_list'),
    path('filter-data_b/<int:brand_id>',views.filter_data_b,name='filter_data_b'),
]

views.py 是

def filter_data_b(request,brand_id):
    colors=request.GET.getlist('color[]')
    categories=request.GET.getlist('category[]')
    brands=request.GET.getlist('brand[]')
    sizes=request.GET.getlist('size[]')
    flavors=request.GET.getlist('flavor[]')
    allProducts=ProductAttribute.objects.filter(brand=brand_id).order_by('-id').distinct()
    if len(colors)>0:
        allProducts=allProducts.filter(productattribute__color__id__in=colors).distinct()
    if len(categories)>0:
        allProducts=allProducts.filter(category__id__in=categories).distinct()
    if len(brands)>0:
        allProducts=allProducts.filter(brand__id__in=brands).distinct()
    if len(sizes)>0:
        allProducts=allProducts.filter(productattribute__size__id__in=sizes).distinct()
    if len(flavors)>0:
        allProducts=allProducts.filter(productattribute__flavor__id__in=flavors).distinct()
    t=render_to_string('ajax/product-list_b.html','data':allProducts)
    return JsonResponse('data':t)

【问题讨论】：

问题再次明确定义 - 我可以使用 /filter-data_b/1 来解决这个问题，其中 1 是硬编码的品牌 ID，我想知道如何在此处将其用作变量ajax URL - 并从模板中获取这个brand_id，其中product-filter.js 从views.py 中的/filter-data_b/1 代码中调用，urls.py 如下所示

我建议您更新帖子。你想访问 javaScript 文件中的 Django 模板变量吗？

【参考方案1】：

这是在外部 .js 文件中访问 Django 模板变量的方法：

在您调用外部 .js 文件的模板中

 // The order is matter, declare the variable before try to access in your external .js file
 <script>
     let object_id = object_id  // Assume that 'object_id' is in the the context data of the template.
     let url = % url 'filter_data_b' brandid %
 </script> 
 <script src="% static 'product-filter.js' %"></script>

在您的外部 .js 文件中

 $.ajax(
     url: url, // Declared above
     ...  
 )

【讨论】：

我用下面的代码行尝试了上面的代码，正如你在我调用外部js的模板中建议的那样" 错误 NoReverseMatch 异常值: 未找到带有参数 '('',)' 的 'filter_data_b' 的反向操作。尝试了 1 种模式：['filter_data_b/(?P[0-9]+)$']

我更新了答案：let url = "% url 'filter_data_b' brandid %" 不是object_id 而是brandid。

太棒了！非常感谢....

你能在解决你的问题时标记答案吗;-)

完成了——太棒了！！！我的第一个答案 - 谢谢 Rvector !!!