Постановка проблемы: у меня нет способа загрузить всю диаграмму html в div, вызвав функцию из views.py и передав контекст на refernece_page. html без обновления страницы.
У меня есть диаграмма, как и у любой биржевой диаграммы. У меня есть раскрывающийся список durtion, для которого я использовал раскрывающийся список Bootstrap.
<div class="dropdown show " style="float:left; ">
<a aria-expanded="false" aria-haspopup="true" role="button" data-toggle="dropdown" class="btn btn-secondary dropdown-toggle" href="#">
<span id="selected" >Event Time</span><span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">1 Hour</a></li>
<li><a class="dropdown-item" href="#">1 day</a></li>
<li><a class="dropdown-item" href="#">1 Week</a></li>
<li><a class="dropdown-item" href="#">1 Month</a></li>
</ul>
</div>
Я хочу выполнить обновление погружения, в котором есть карта, без обновления страницы. Для этого у меня есть функция per_hour_data в views.py, которая загружается со значением по умолчанию длительностью «1 час».
def per_hour_data(request, app_id, record_count):
app_detail = get_object_or_404(AppDetail, app_id=app_id)
line_data = line_chart_data(app_id,record_count)
app_data = AppDetail.objects.all()
context = {
'line_data':line_data,
'app_detail': app_detail,
'record_count':{'1day':'1day', '1hour': '1hour', '1week':'1week', '1month':'1month'},
'app_data':app_data,
}
return render(request, 'status_monitor/reference_page.html', context)
reference_page. html содержит данные диаграммы и где я анализирую контекст. Теперь я хочу сделать что-то вроде того, когда я выбираю другую продолжительность, тогда диаграмма должна обновляться без обновления страницы. Я думал сделать это с помощью AJAX. поэтому я написал другую функцию
def update_chart(request):
if request.is_ajax and request.method == "GET":
app_id = request.GET.get(app_id)
record_count = request.GET.get(record_count)
app_detail = get_object_or_404(AppDetail, app_id=app_id)
line_data = line_chart_data(app_id,record_count)
app_data = AppDetail.objects.all()
context = {
'line_data':line_data,
'app_detail': app_detail,
'record_count':{'1day':'1day', '1hour': '1hour', '1week':'1week', '1month':'1month'},
'app_data':app_data,
}
return render(request, 'status_monitor/reference_page.html', context)
и вызов AJAX как
{% block javascript %}
<script>
$(".dropdown-menu li").click(function () {
var record_count = $(this).text();
var app_id = getElementById('#app_id');
$.ajax({
type:'GET',
url: '/update_chart/',
data: {
'record_count': record_count,
'app_id' : app_id
},
dataType: 'json',
success: function (data) {
alert(data.error_message);
},
error: function (response) {
console.log(response)
}
});
});
</script>
{% endblock %}
urls
urlpatterns = [
path('status/<app_id>/<str:record_count>/' ,views.per_hour_data, name='per_hour_data'),
path('update_chart/', views.update_chart, name='update_chart'),
]
Я не получение способа, с помощью которого я могу загрузить весь html в div, передав контекст в reference_page. html.