Обновление страницы с помощью формы и бэкэнда Django

Question

Я работаю над веб-приложением, которое обслуживается HTML / JS / CSS на внешнем интерфейсе и на Django / Python Backend.То, что я собираюсь сделать, - это обновить интерфейсную страницу на основе некоторого ввода от пользователя в HTML-форму, которая затем будет передана бэкэнду в виде jjuery ajax.На этом этапе сервер будет манипулировать этими данными, переданными в форме, а затем вернет новые данные в запрос jQuery, откуда я могу редактировать страницу без перезагрузки.

Однако, когда я пытаюсь это сделать, страница перенаправляется на мой пост URL.Как мне передать данные обратно из бэкэнда во внешний интерфейс, не вызывая перезагрузку или перенаправление страницы.

Вот как выглядит мой код:

Ajax-форма jQuery внешнего интерфейса:

$('#InputForm').on('submit', function(event){
    event.preventDefault();
    console.log("form submitted!")
    $.ajax({
        url : "/friendData/", // the endpoint
        type : "POST", // http method
        data : { friend : $('#FriendInput').val(), csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val() }, // data sent with the post request

        // handle a successful response
        success : function(json) {
            $('#FriendInput').val(''); // remove the value from the input
            console.log(json); // log the returned json to the console
            console.log("success"); // another sanity check
        },

        // handle a non-successful response
        error : function(xhr,errmsg,err) {
            $('#results').html("<div class='alert-box alert radius' data-alert>Oops! We have encountered an error: "+errmsg+
                " <a href='#' class='close'>&times;</a></div>"); // add the error to the dom
            console.log(xhr.status + ": " + xhr.responseText); // provide a bit more info about the error to the console
        }
    });
});

Views.py Файл:

def friendData(request):
    if request.method == "POST":
        return JsonResponse({"result": "works"}, content_type="application/json", safe=False)
    else:
        return JsonResponse(
                {"nothing to see", "this not happening"}, content_type="application/json")

и URLS.py

urlpatterns = [
    path('friendData/',views.friendData, name='friendData')
]

HTML-форма:

<form action="friendData/" method="POST" id="InputForm">
                {% csrf_token %}
                <div class="form-group">
                    <label for="FriendInput">Friend name</label>
                    <input type='text' class="form-control" id="FriendInput" aria-describedby="FriendHelp" placeholder="Friend">
                    <small id="FriendHelp" class="form-text text-muted">Input the Friend's name</small>
                </div>
            </form>

Всякий раз, когдаЯ отправляю форму, которую перенаправляю на localhost: 8000 / friendData, и она просто отображает ответ json.Как мне отправить ответ json обратно на запрос ajax, где я могу обработать его и манипулировать страницей индекса без обновления, вместо того чтобы переходить на новую страницу целиком.