I have a django app that parses a csv and stores the data in sqlite which works great and i can see the data in the admin panel. Now i’m having trouble displaying the data either in the front end as a table or in the console.
views.py
def airpollution_table_data(request):
table_data = {}
pollutant_list = [pollutant for pollutant in Pollutant.objects.all()]
country_list = [country for country in Country.objects.all()]
for pollutant in pollutant_list:
table_data[pollutant.name] = {}
for i, country in enumerate(country_list):
total = PollutantEntry.objects
.aggregate(total=Sum('pollution_level', filter=Q(pollutant=pollutant,
country=country)))['total']
minimum = PollutantEntry.objects
.aggregate(min=Min('pollution_level', filter=Q(pollutant=pollutant,
country=country)))['min']
maximum = PollutantEntry.objects
.aggregate(max=Max('pollution_level', filter=Q(pollutant=pollutant,
country=country)))['max']
count = PollutantEntry.objects.filter(pollutant=pollutant, country=country).count()
units = PollutantEntry.objects.filter(pollutant=pollutant, country=country).first()
units = units.units if units else ''
if total is not None and count:
table_data[pollutant.name][country.iso_code] = {'avg': total / count, 'min': minimum,
'max': maximum,
'limit': pollutant.limit_value, 'units': units}
return JsonResponse(table_data)
URLs.py
from django.urls import path
from . import views
app_name = 'supplychain'
urlpatterns = [
path('', views.airpollution, name='airpollution'),
path('airpollution_table_data', views.airpollution_table_data, name='airpollution_table_data'),
path('temp_country_creator', views.temp_country_creator, name='temp_country_creator')
]
welcome.html table code
<!-- Table Section-->
<section class="page-section mt-5" id="data-table">
<div class="container">
<!-- Heading-->
<h2 class="page-section-heading text-center text-uppercase text-secondary mb-0">Data Table</h2>
<!-- Icon Divider-->
<div class="divider-custom">
<div class="divider-custom-line"></div>
<div class="divider-custom-icon"><i class="fas fa-star"></i></div>
<div class="divider-custom-line"></div>
</div>
<!-- Table-->
<div class="row">
<div class="col-lg-8 mx-auto">
<table id="our-table" class="table">
<thead>
<tr>
<th scope="col">Pollutant</th>
<th scope="col">Country</th>
<th scope="col">Avg</th>
<th scope="col">Min</th>
<th scope="col">Max</th>
<th scope="col">Limit</th>
<th scope="col">Units</th>
</tr>
</thead>
<tbody id="table-body">
</tbody>
</table>
</div>
</div>
</div>
</section>
{% endblock %}
{% block js %}
<!-- Page level plugins -->
<script src="{% static 'vendor/datatables/jquery.dataTables.min.js' %}"></script>
<script src="{% static 'vendor/datatables/dataTables.bootstrap4.min.js' %}"></script>
<script>
$(document).ready(function () {
$.get("airpollution_table_data", function (data) {
console.log(data)
});
})
</script>
{% endblock %}
Initially I was trying to show the data in a html table using javascript but that wasn’t working so i tried to do console.log and I’m still unable to see anything in the network console in google chrome.
Any ideas what’s wrong? I’ve been stuck in this for the last couple of days lol
