Ajax-форма не отправляет данные в django

Я пытаюсь отправить данные в django без обновления страницы. Поэтому я использую ajax. Создал модель django и форму

class MyModel(models.Model):
    text=models.CharField(max_length=100)

class MyForm(forms.ModelForm):
    class Meta:
        model=MyModel
        fields = "__all__"

Затем отправьте форму на html-страницу через views.py

def home(request):
    print(request.POST.get('text',False))
    form = MyForm(request.POST)
    if request.method=='POST':
        print(request.POST.get('text',False))
        if form.is_valid():
            data=form.save()
    return render(request,'home.html',{'form':form})

Создание орм в html шаблоне

<form action = ""  id="post-form" method = "post">
      {% csrf_token %}
      
      {{ form.as_p }}
      <input type="submit" value="submit" id="submit-button">
    </form>

Это файл javascript


$(document).on('submit','#post-form',
    function(x){
        x.preventDefault();
        console.log("button clicked")
    $.ajax({
            type:'POST',
            url:'/',

            data:{
                text:$("id_text").val(),
                csrfmiddlewaretoken:$('input[name=csrfmiddlewaretoken]').val()
                },
           

            success:function(){
                alert('Saved');
                      }
                    })            
    
    
    }

)

Я не могу найти, где находится проблема.

Вы должны использовать # для выбора id, поэтому используйте text:$("#id_text").val().

Для использования динамического url используйте следующее:

url:"{% url 'home' %}",

Для получения дополнительной информации об использовании динамических урлов обратитесь к этому вопросу.

Редактирование:

Один из способов использовать динамический url - передать его с помощью события onsubmit, поэтому попробуйте следующее:

Файл шаблона или home.html

 <form id="post-form" method="POST" onsubmit="checking('{% url 'home' %}')">
        {% csrf_token %}
        
        {{ form.as_p }}
        <input type="submit" value="submit" id="submit-button">
    </form>

Js файл:

function checking(dynamicUrl) {
  $(document).on("submit", "#post-form", function (x) {
    x.preventDefault();
    console.log("button clicked");
    $.ajax({
      type: "POST",
      url: dynamicUrl,

      data: {
        text: $("#id_text").val(),
        csrfmiddlewaretoken: $("input[name=csrfmiddlewaretoken]").val(),
      },

      success: function () {
        alert("Saved");
      },
    });
  });
}
Вернуться на верх