Django - 创建画廊,然后将照片添加到画廊
Django - create gallery, then add photos to gallery
我正在使用 Django 1.8 和 Dropzone JS 文件上传包
我想添加一个画廊(我的画廊叫'fountains'),然后将照片添加到画廊。
这是我的工作流程:
- 使用模型形式添加画廊
- 重定向到图库视图
- 画廊视图有一个自动生成的 link 转到 photo_upload 视图,因此用户可以将照片添加到新画廊
- photo_upload view/template 使用 Dropzone javascript 加载项
- 照片通过 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
我正在使用 Django 1.8 和 Dropzone JS 文件上传包
我想添加一个画廊(我的画廊叫'fountains'),然后将照片添加到画廊。
这是我的工作流程:
- 使用模型形式添加画廊
- 重定向到图库视图
- 画廊视图有一个自动生成的 link 转到 photo_upload 视图,因此用户可以将照片添加到新画廊
- photo_upload view/template 使用 Dropzone javascript 加载项
- 照片通过 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