Как отправить форму и отобразить вывод без обновления

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

<form id="myform" method="POST">
    {% csrf_token %}
    Enter first number: <input type="text" name="num1"><br><br>
    <input type="submit">
</form>

и вот вывод в нужной мне форме: 

<h1>congrats!</h1>

все просто. заполняем форму, отправляем и выводим простое сообщение без обновления

Если у вас ноль знаний и вы не смогли создать ни одного кода, вы, скорее всего, столкнетесь с множеством проблем, AJAX против Django формы - это другой уровень сложности и не будет реализован, если вы не уверены на 100%, что это добавит что-то к UX, но вкратце

Используя Jquery, вы можете построить Ajax вызов к Django представлению :

JS Script:

 $(document).ready(function () {
      $("form").submit(function (event) {
        var formData = {
          justification: $("#justification").val(),
          

        };
    
        $.ajax({
          type: "POST",
          url: "{% url 'django-view'  %}",
          data: formData,
          dataType: "json",
          encode: true,
        }).done(function (data) {
          
          if (data.success) {
            console.log("error");
    
         
          } else {
           # display your text somewhere in your page
          }
        });
    
        event.preventDefault();
      });
    });

Django View :

@csrf_exempt
def form_post(request):
    # Do something with your data
    text = request.POST.get("num1")
    print(text)
    return JsonResponse({"text": text})

Как вы видите, для работы с Ajax вам нужно гораздо больше, вам нужно хорошее понимание формы Django, достаточно хорошее для Ajax и JS и, наконец, как работает асинхронность.

Вернуться на верх