使用 django ajax jquery 提交一个文件不起作用的表单

Posted 2023-03-27

【中文标题】使用 django ajax jquery 提交一个文件不起作用的表单

【英文标题】：submit a form with file not working using django ajax jquery

【发布时间】：2019-06-06 07:22:29

【问题描述】：

当用户提交表单时，在其他数据旁边上传图片。在 jquery 中使用 formData。

我在模型中添加了图片字段 在表单中添加了图片元素 在html中添加了输入标签 通过 AJAX 将数据发送到视图 从ajax请求中获取数据并添加到视图函数中

系统显示错误：

有效表格 内部服务器错误：/create/te2chira

Traceback（最近一次调用最后一次）：文件“C:\Users\LT GM\AppData\Local\Programs\Python\Python37\lib\site-packages\django\db\backends\utils.py", 第 85 行，在 _execute return self.cursor.execute(sql, params) File "C:\Users\LT GM\AppData\Local\Programs\Python\Python37\lib\site-packages\django\db\backends\sqlite3\base.py", 第 296 行，执行中 返回 Database.Cursor.execute(self, query, params) sqlite3.IntegrityError: NOT NULL 约束失败：blog_te2chira.num n

models.py

class te2chira(models.Model):
    te2chira_id = models.AutoField( primary_key=True)
    num = models.IntegerField()
    # year = models.IntegerField()
    te2chira_date = models.DateField()
    title = models.CharField(max_length=250,default='DEFAULT VALUE', blank=True, null=True)
    description = models.CharField(max_length=500,default='DEFAULT VALUE', blank=True, null=True)
    is_sent=models.IntegerField()
    picture = models.ImageField(upload_to = 'pictures/%d/%m/%Y/',null=True, blank=True)

    def __str__(self):
        return str(self.te2chira_id)

form.py

from django import forms
from blog.models import te2chira, destination

class SaveTe2chira(forms.ModelForm):

    class Meta:
        model = te2chira
        fields = ['title', 'description','picture' ]

html

<form method="POST" class="form-style-9" enctype="multipart/form-data">
        % csrf_token %
         form.as_p 
<li>
 <input type="file" id="img" name="img"/>   
</li>
<li>
<input type="submit" class="field-style field-full align-none" id="save" value="save" />
 <script type="text/javascript">
             $(function()
                $('#save').on('click',function(e)
                    e.preventDefault()
                    var formData = new FormData();
                    formData.append('num',$('#num').val())
                    formData.append('title',$('#title').val())
                    formData.append('text',$('#text').val())
                    formData.append('issent', 0)
                    formData.append('img', document.getElementById('img').files[0])



                $.ajax(
                    url:'/create/te2chira',
                    method:'POST',
                    data:formData,
                    processData:false,
                    contentType:false,
                    headers:
                        'X-CSRFToken':'csrf_token'
                    
                ).done(function(msg) 
                    document.location = "/creativePageSend.html"
                    alert('data saved')


                ).fail(function(err)
                    alert('no data was saved')
                )
            )
        )
</script>

</li>
    </ul>
</form>

views.py

def post_new(request):
    if request.method =='POST':
        form = SaveTe2chira(data = request.POST, files = request.FILES)
        if form.is_valid():
            print("valid form")
            form.save()
            id=form.te2chira_id
            print(id)
            request.session['idTe2chira']=id
            return render(request,'./creativePageSend.html','id':id)
        else:
            print("invalid form")

上传包含所有用户输入的图像。

【参考方案1】：

调用错误是因为 num,te2chira_date,is_sent 等字段为空。

为其设置默认值或blank=True, null=True 并迁移它

【参考方案2】：

您的 Django 表单只有 ['title', 'description','picture' ] 字段，但您的 HTML 表单正在发布 ['title', 'num', 'text', 'img', 'issent']。所以你的表单基本上只设置title并且是有效的，因为description和picture可以是blank。

保存表单时，模型实例只设置了title，其他字段均为空白，根据您的模型定义，这是不允许的。

您应该使您的 HTML 字段名称与表单字段名称匹配，并在保存表单（和模型）之前确保所有必需的模型字段都有一个值。