Django - 创建画廊,然后将照片添加到画廊

Django - create gallery, then add photos to gallery

我正在使用 Django 1.8 和 Dropzone JS 文件上传包

我想添加一个画廊(我的画廊叫'fountains'),然后将照片添加到画廊。

这是我的工作流程:

  1. 使用模型形式添加画廊
  2. 重定向到图库视图
  3. 画廊视图有一个自动生成的 link 转到 photo_upload 视图,因此用户可以将照片添加到新画廊
  4. photo_upload view/template 使用 Dropzone javascript 加载项
  5. 照片通过 dropzone 上传,照片详细信息写入照片 model/table 包括新的画廊 ID 作为外键

当我没有通过图库的pk 时,我可以使用Dropzone 成功上传照片。所以我很确定这不是我的问题。

但是,当我按如下方式输入 url 时,photo_upload 视图给我一个错误:

http://localhost:8000/photo_upload/17/ 

此 link 对应于 urls.py 中的 url,它找到 photo_upload 视图,但在解析视图时会产生以下消息。

NoReverseMatch at /photo_upload/17/

Reverse for 'photo_upload' with arguments '()' and keyword arguments '{}' not found. 1 pattern(s) tried: ['photo_upload/(?P<id>\d+)/$']

我正在寻找 photo_upload 视图给出此错误的原因。任何其他技巧等也可以使这一点得到更好的理解。

我的模特:

class Fountains(models.Model):
    foun_name = models.CharField(max_length=100, blank=True, null=True)
    foun_desc = models.TextField(blank=True, null=True)
    foun_address = models.CharField(max_length = 100, blank=True, null=True)
    foun_lat = models.CharField(max_length=20, blank=True, null=True)
    foun_lon = models.CharField(max_length=20, blank=True, null=True)
    created = models.DateTimeField(auto_now_add=True)
    modified = models.DateTimeField(auto_now=True)

    class Meta:
        managed = True
        db_table = 'fountains'

class Photos(models.Model):
    filename = models.ImageField(upload_to='.')
    ext = models.CharField(max_length=5, blank=True, null=True)
    desc = models.TextField(blank=True, null=True)
    fountain_id = models.IntegerField(blank=True, null=True)
    #fountain = models.ForeignKey('Fountains')
    user_id = models.IntegerField(blank=True, null=True)
    tag_count = models.IntegerField(blank=True, null=True)
    photos_tag_count = models.IntegerField(blank=True, null=True)
    comment_count = models.IntegerField(blank=True, null=True)
    created = models.DateTimeField(auto_now_add=True)
    modified = models.DateTimeField(auto_now=True)

    class Meta:
        managed = True
        db_table = 'photos'

我的表格:

class PhotoForm(forms.Form):
    filename = forms.FileField()
    fountain_id = forms.IntegerField('fountain')
    class Meta:
        model = Photos

class FountainForm(ModelForm):
    class Meta:
        model = Fountains
        fields = [
            'foun_name', 
            'foun_desc', 
            'foun_address', 
            'foun_lat',
            'foun_lon'
            ]
        labels = {
            'foun_name': _('name'), 
            'foun_desc': _('description'), 
            'foun_address': _('street address'),
            'foun_lat': _('lat'),
            'foun_lon': _('lon')
            }

我的观点:

这是添加图库的视图:

def fountain_add(request):
    if request.method == 'POST':
        form = FountainForm(request.POST)
        if form.is_valid():
            new_fountain = form.save()
            return HttpResponseRedirect(reverse(fountain, args=(new_fountain.pk,)))
    else:        
        form = FountainForm()

    return render(request, "app/fountain_add.html", {'form': form})

这是要重定向到新画廊视图的视图:

def fountain(request, id):
    assert isinstance(request, HttpRequest)
    fountain = Fountains.objects.get(id=int(id))
    context_dict = {'fountain': fountain}
    return render(
        request,
        'app/fountain.html',
        context_dict,
        context_instance = RequestContext(request)
    )

Photo_upload 浏览量:

@login_required
def photo_upload(request, id):
#def photo_upload(request):
    fountain = Fountains.objects.get(id=int(id))
    if request.method == 'POST':
        form = PhotoUploadForm(request.POST, request.FILES)
        if form.is_valid():         
            new_photo = Photos(filename = request.FILES['filename'])
            new_photo.save()
            return HttpResponse('Image upload succeeded.')
    else:
        form = PhotoUploadForm()

    data = {'form': form}
    return render_to_response('app/photo_upload.html', data, context_instance=RequestContext(request))

我的模板:

这是图库视图的模板,具有 photo_upload link:

{% extends "app/layout.html" %}
{% block content %}
    <h1>Fountain Details</h1>
    <div style="width:600px">
        <p>Name: {{ fountain.foun_name }}</p>
        <p>Desc: {{ fountain.foun_desc }}</p>
        <p>Address: {{ fountain.foun_address }}</p>
        <p>Lat: {{ fountain.foun_lat }}</p>
        <p>Lon: {{ fountain.foun_lon }}</p>
        <p><a href="/photo_upload/{{ fountain.id }}/"}>Upload photos</a></p>
    </div>
{% endblock content %}

我的 photo_upload 模板。这里面有 dropzone.js:

 {% extends "app/layout.html" %}

    {% block content %}

    <h1>Photo Upload</h1>
    <p>Fountain: {{ fountain.foun_name }}</p>

    {% load staticfiles %}
    <link href="{% static 'dropzone/dropzone.css' %}" rel="stylesheet">

     <form action="{% url "photo_upload" %}" class="dropzone" id="myDropzone"  method="post" enctype="multipart/form-data">
        {% csrf_token %}
        <div class="fallback">
            <p><input name="fountain" type="hidden" /></p>
            <p><input name="file" type="file" multiple /></p>
            <p><input type="submit" value="Upload" /></p>
        </div>
    </form>

    <script src="{% static 'dropzone/dropzone.js' %}"></script>

    <script type="text/javascript">
        Dropzone.options.myDropzone = {
            autoProcessQueue: false,
            paramName: "filename",
            addRemoveLinks: true,

            //parallelUploads: 1,
            init: function () {
                var submitButton = document.querySelector("#submit_photos")
                myDropzone = this;
                submitButton.addEventListener("click", function () {
                    myDropzone.processQueue();
                });
                myDropzone.on("complete", function (file) {
                    myDropzone.removeFile(file);
                });
            }
        };
    </script>

    <button id="submit_photos">
        Submit all files
    </button>

{% endblock content %}

这些是相关的 url:

url(r'^fountain_add', 'app.views.fountain_add', name='fountain_add'),
url(r'^fountain/(?P<id>\d+)/$', 'app.views.fountain', name='fountain'),
url(r'^photo_upload/(?P<id>\d+)/$', 'app.views.photo_upload', name='photo_upload'),

如果你不附加 id ,那么视图写成

def photo_upload(request, id=None):

"{% url 'photo_upload' id %}" #id if you are attaching /id in url.

您的 photo_upload 视图需要参数 id