Html 使用Ajax的Django ModelForm避免页面刷新

我是django和ajax的新手。我做过研究，但我发现大多数结果在我的项目中很难理解

下面是我表单的html代码

     <form action='' method="post" enctype='multipart/form-data'>
        {% csrf_token %} {{ form.as_p }}

        <button type="submit">Save changes</button>
    </form>

我的网址

 url(r'^manufacturer_view_profile/(?P<slug>[\w-]+)/$',views.DetailMfg,name="mfgdetail"),

---

对于第一个问题，请不要使用HTML表单进行POST请求。您可以使用JQuery on click事件侦听器来侦听submit按钮click，并在事件处理程序中使用$.post（）向服务器发出post请求。

请按照以下步骤操作。

步骤1）将id属性添加到表单以标识所有表单

替换

<form action='' method="post" enctype='multipart/form-data'>

<button type="submit">Save changes</button>

对于第二个问题，您可以使用

if self.request.is_ajax():

用户可以确定收到的请求是否是AJAX请求

i、 e

---

您必须知道，当您使用AJAX发出POST请求时，您不需要。您只需从输入字段中获取所需的所有数据，将其打包为对象，然后将此对象作为“数据”参数。

非常感谢。如果您不介意，请您介意使用完整的Jquery和view代码与我解释一下。我是一名初学者。我将通过代码示例理解。谢谢。但是如何在不使用form.save（）的情况下将数据存储到数据库中。请假设我对ajax一无所知。我添加了模型。我尝试了您的解决方案，但似乎不起作用。可能是因为我不知道如何将数据传递到服务器。您的web浏览器控制台中是否显示了任何内容？好吧，只是为了确保我们讨论的是相同的内容。要打开控制台，您必须在Microsoft Edge中单击F12或在Google Chrome中单击Ctrl+Shift+I。之后，单击“控制台”。这些是你打开控制台的方式吗？

<form id="a-good-form-name" action="" method="post"  enctype="multipart/form-data">

<button type="submit">Save changes</button>

<button type="button" class="btn-submit">Save changes</button>

<script src="link_of your_file.js"></script>

$(document).ready(function () {

    //Put your JQuery or JavaScript code into here

    $("#a-good-form-name .btn-submit").click(function(){
        $.post("the_url_you_like",{
                data_from_form:$('#a-good-form-name [name="textbox1"]').val(),
                int_data: 123321
            },function(data){
                //What you want to do using the data recieved from the server after POST request made sucessfully.
            }
        });
    });
});

if self.request.is_ajax():

def DetailMfg(request,slug):
    instance=get_object_or_404(ManufacturerProfile,slug=slug)
    form =UpdateManufacturerLogo(request.POST or None ,request.FILES,instance=instance)
    form1 = UpdateManufacturerBackgroundprofileForm(request.POST ,request.FILES,instance=instance)
    if request.method == 'POST' and request.is_ajax():
       if form1.is_valid() and form.is_valid():
          data_you_need=request.POST.get('data_from_form')
          integer_data=request.POST.get('int_data')

          #store data to the database without using form.save() 
          #or do whatever you want using the data

       else:
          form=UpdateManufacturerBackgroundprofileForm(instance=instance)
          form =UpdateManufacturerBackgroundprofileForm(instance=instance)

    context={'instance':instance,
         'distributorprofile':distributorprofile,
         'form':form,
         'form1':form1}
    template_name="gbiz1990/User_function_pages/User_company_info_pages/user_mfgprofile_home.html"
    return render(request,template_name,context)