Как отобразить график plotly при отправке формы в django

У меня есть форма в шаблоне django следующего вида

<div class="container">
    <div class="bar_graph_container">
        <form id="bar_graph_form" method="post" action="display_bar_graph">
            {% csrf_token %}
            <select class="form-select bar_dropdown" aria-label="Default select example" name="bar_graph_dropdown">
                <option selected>Select data to visualise</option>
                <option value="1">By category</option>
                <option value="2">By language</option>
            </select>
        </form>

        <div class="bar_graph_container">

        </div>
    </div>
</div>

При изменении значения выпадающего списка я хочу, чтобы форма отправлялась и отображала график в div.bar_graph_container

Для достижения этой цели я попробовал следующее

js файл

$(document).ready(function () {
    $('.bar_dropdown').change(function (event) {
        event.preventDefault();
        var data = new FormData($('#bar_graph_form').get(0));

        $.ajax({
            url: $(this).attr('action'),
            type: $(this).attr('method'),
            data: data,
            cache: false,
            processData: false,
            contentType: false,

            success: function (data) {
                console.log('form submitted successfully')
                console.log(data)
            }
        })
    })
})

views.py

def display_bar_graph(request):
    if request.method == 'POST':
        user_select = request.POST['bar_graph_dropdown']

        if int(user_select) == 1:
            graph = plotly_helper.make_bar_graph('category', 'count', 'category', 'count', None)
        
        if int(user_select) == 2:
            graph = plotly_helper.make_bar_graph('language', 'count', 'language', 'count', None)
        
        # context = {'graph': graph}
        print('the form was submitted using ajax')
        return JsonResponse(graph, safe=False)

Пока что-то происходит, это просто возвращает весь HTML-контент страницы в переменной data.

Печать в views.py не печатается, что заставляет меня думать, что представление даже не запущено.

Я не уверен, что я делаю неправильно

Ссылки, по которым я перешел

  1. how to submit form on dropdown change
  2. display plotly chart with top_html
  3. submit form with ajax when dropdown change
Вернуться на верх