how to pass filter data from Django model/view to ajax? I tried to pass the data but, it’s showing no result. The ajax return field is blank. From the request get method I tried to post the data, that’s working fine. With the ajax method, I tried to do as follows, but it’s throwing just a blank area. I tested on console, the filter value is correctly passed to views but from views, it’s not fetching correctly. Is it an ajax success problem or do my views has any other issue? Please help me
My HTML:
<ul class="widget-body filter-items ">
{% for categories in categories%}
<li class = "sidebar-filter " data-filter="category" data-value="{{categories.id}}" ><a href="#">{{categories.name}}</a></li>
{% endfor %}
</ul>
<div class="product-wrapper row cols-lg-4 cols-md-3 cols-sm-2 cols-2">
{% for product in products%}
<div id = "product-wrapper" class="product-wrap product text-center">
{{product.name}}
{% endfor%}
</div>
</div>
Ajax:
$(document).ready(function () {
$('.sidebar-filter').on('click', function () {
var filterobj= {};
$(".sidebar-filter").each(function(index, ele){
/**var filterval = $(this).attr('data-value');*/
/**var filterval = $(this).value=this.attr('title');*/
/**var filterval = $(this).val($(this).text());*/
var filterval=$(this).data("value");
var filterkey = $(this).data('filter');
filterobj[filterkey]= Array.from(document.querySelectorAll
('li[data-filter=' + filterkey+'].active')).map(function(el){
/**return $(el).data("value");*/
return $(el).data("value")
/** return el.getAttribute('data-value');*/
});
});
console.log(filterobj)
$.ajax ({
url:"/products/filter-data",
data:filterobj,
datatype:'json',
success:function(res){
console.log(res.data)
var bodyOnly = $(res.data).find('.product-wrapper').html();
$('.product-wrapper').html(bodyOnly);
console.log(bodyOnly)
}
});
});
});
My views.py:
def catfilter(request):
categories = request.GET.getlist('category[]')
brands = request.GET.getlist('brands[]')
products=Products.objects.filter(is_published=True).order_by('-id')
if len(categories)>0:
products=Products.objects.filter(is_published=True).order_by('-id')
if len(brands)>0:
products=Products.objects.filter(is_published=True).order_by('-id')
json_sort=render_to_string("./ecommerce/shop.html",{'data':products})
return JsonResponse({'data':json_sort})