Как передать аргументы из JavaScript в представление Django?

Question

Я пытаюсь сделать страницу с простым калькулятором. Я сделал калькулятор в js, и теперь, когда я нажимаю кнопку, я хочу передать аргументы из js в django. Посчитайте их там и напечатайте на странице перенаправления.

У меня проблема с перенаправлением страницы. Когда я не помещаю кнопку в форму, js-скрипт вызывает калькуляцию, но не перенаправляет страницу. Я хочу перенаправить страницу и распечатать результат там.

HTML-код:

<form action="calc/" method="post">
    {% csrf_token %}
    <input id='btn' type="submit" value="CALC" onclick="change()">
</form>

код JavaScript:

function change(){
    var foo = 1;
    var foo1 = [1, "tralal", true, ''];

    $.ajax({

        url: 'calc/',
        data : {
            'foo': foo,
            'foo1': foo1,
        },
        success: function (data) {
            alert("it worked!");
        }
    }
)};

URL в Джанго

path('calc/', views.calc, name='calc')

просмотр в Джанго

def calc(request):
    foo = request.GET.get('foo')
    print(foo)
    foo1 = request.GET.getlist('foo1[]')
    print(foo1)
    context = {'data': foo1}
    return render(request, 'calc.html', context)

Answer 1

Я делаю что-то подобное, это работает, но я не знаю, правильно ли это.

views.py

def link(request):
    global matrix
    matrix = request.GET.getlist('foo1[]')
    return HttpResponseRedirect('/calc/')


def calc(request):
    if request.is_ajax:
        global matrix
        context = {'data': matrix}
        return render(request, 'calc.html', context)
    else:
        return HttpResponseRedirect('/')

urls.py

path('link/', views.link, name='link'),
path('calc/', views.calc, name='calc'),

js function

$(document).ready(function() {
$("#btn").click(function(e) {
    var foo = 1;
    var foo1 = [1, "tralal", true, ''];

    $.ajax({
        url: 'link/',
        data : {
            'foo': foo,
            'foo1': foo1,
        },
        success: function (data) {
             window.location.href = "calc/"
        }
    });
});
});

html code

<input id='btn' type="submit" value="COUNT">

calc.html

{% for d in data %}
    <p>"{{ d }}"</p>
{% endfor %}

Перенаправление страницы на calc / и отображение правильной, а не ни одной матрицы. Результат

Answer 2

То, что вы получаете при использовании window.location.href = "127.0.0.1:8000/calc" - это нормально. Вы просто перенаправляете на ту же страницу без параметров URL-запроса.

Итак, вы в основном хотите перенаправить на ту же страницу? Почему тогда вы хотите перенаправить? Это не имеет большого смысла для меня. И снова, если вы хотите перенаправить, не используйте AJAX и следуйте «обычному» подходу при отправке форм.

Так что, на мой взгляд, имеет смысл не перенаправлять, а использовать данные, которые вы получаете из запроса AJAX, и отображать информацию. Вы все еще можете использовать некоторую соблазнительность Django и вернуть какой-то отрендеренный HTML, который вы затем добавите динамически с некоторым кодом Javascript.

Это может быть что-то вроде этого:

Javascript

$.ajax({
    url: 'link/',
    data : {
        'foo': foo,
        'foo1': foo1,
    },
    success: function (data) {
         $('#result-container').html(data)  // add the data in the div container
         $("#your-form").trigger('reset'); //you should reset your form
    }
});

Основной HTML в "/" должен содержать

<div id="result-container"></div>

И вам нужно просто избавиться от просмотра ссылок и сделать так, чтобы другие как-то так

def calc(request):
    if request.is_ajax:
        matrix = request.GET.getlist('foo1[]')
        context = {'data': matrix}
        return render(request, 'calc.html', context)

Но я говорю вам снова, вы должны использовать формы Django для того, что вы делаете. См. этот учебник , например.

Надеюсь, это поможет.

Answer 3

Если вы хотите перенаправить на другую страницу, вы должны сделать это явно из JavaScript, когда вызывается обратный вызов успеха.Вы можете увидеть здесь некоторые ответы о том, как перенаправить страницу из JavaScript.Для этого вам понадобится другое представление для отображения страницы результатов.Результаты расчета могут храниться на сервере (кэшироваться) или передаваться с клиента.

Но мне интересно, почему вы используете для этого запрос Ajax.Ajax-запросы полезны, если вы хотите выполнить некоторые асинхронные http-запросы к серверу без обновления (или перенаправления) страницы.Поэтому я бы сказал, что не используйте Ajax-запрос здесь, просто отправьте форму.Вы можете посмотреть, например, здесь , чтобы увидеть, как формы работают в javascript.Вы также можете проверить этот учебник Django об использовании форм.В Django есть несколько инструментов для работы с формами, которые могут быть очень удобны, например, когда вы хотите обновить или создать новые экземпляры в вашей модели базы данных.Вначале это может немного сбивать с толку, но я думаю, что стоит потратить некоторое время на понимание форм Джанго.