在ModelForm(Django)中上传FileField的进度条

时间:2015-01-18 20:18:14

标签: django file-upload

我正在寻找实现文件上传进度条的一些指示,该进度条提供有关在ModelForm中上传FileField的当前状态的反馈。

我的ModelForm有很多字段(不仅仅是FileField),我想通过进度条显示进度的实时反馈。

感谢。

1 个答案:

答案 0 :(得分:3)

以下是我对问题的解决方案:django-smartfields,此应用可以处理报告进度,转换图像或视频,清理旧文件等。它对进度报告有一些要求:

我正在研究django-smartfields的文档,但是应用程序的这一部分仍然没有记录,但这是你如何使用它。

from django.db import models
from django.conf import settings
from smartfields import fields

class FileModel(models.Model):
    user = models.ForeignKey(settings.AUTH_USER_MODEL, editable=False)
    file = fields.FileField(uploadTo='files')
    # other fields ....
    parent_field_name = 'user'

    def has_upload_permission(self, user, field_name=None):
        return user == self.user

现在在forms.py

from django import forms
from myapp.models import FileModel
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Layout
from smartfields.crispy.layout import FileField

class FileForm(forms.ModelForm):

    class Meta:
        model = FileModel
        fields = ('file', other fields...)

    @property
    def file_upload_url(self):
        return reverse("smartfields:upload", kwargs={
            'app_label': 'test_app',
            'model': FileModel.__name__,
            'field_name': 'file',
            'pk': self.instance.pk,
            'parent_field_name': 'user'
            'parent_pk': self.instance.user.pk
        })


    def __init__(self, *args, **kwargs):
        super(FileForm, self).__init__(*args, **kwargs)
        self.helper = FormHelper(self)
        self.helper.form_tag = False
        self.helper.layout = Layout(
            FileField('file', plupload_options={
                'url': self.file_upload_url,
                'filters': {
                    'max_file_size': "20mb",
                    'mime_types': [{'title': "Documents",
                                    'extensions': "pdf,doc"}]
            }}))

除了'file_form'应该在上下文中之外,views.py中不需要做任何特殊操作。确保smartfields位于INSTALLED_APPSurls中包含url(r'^smartfields/', include('smartfields.urls', namespace='smartfields')),,或者您可以通过扩展smartfields.views.FielUpload来创建自定义上传视图。

在模板中:

{% load static crispy_forms_tags %}
<link rel="stylesheet" href="{% static 'bootstrap3/css/bootstrap.min.css' %}">
<link rel="stylesheet" href="{% static 'bootstrap3/css/bootstrap-theme.min.css' %}">
<link rel="stylesheet" href="{% static 'css/smartfields.css' %}">

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="{% static 'bootstrap3/js/bootstrap.min.js' %}"></script>
<script type="text/javascript" src="{% static 'plupload/js/plupload.full.min.js' %}"></script>
<script type="text/javascript" src="{% static 'js/bootbox.min.js' %}"></script>
<script type="text/javascript" src="{% static 'js/smartfields.js' %}"></script>

<form method="POST">
  {% crispy file_form %}
  <input class="btn btn-default" type="submit" name="btn_save" value="Save">
</form>

如果您有任何问题或者由于某种原因它不起作用,请告诉我。确保你使用github的版本,pypi上的javascript文件已经过时了。