按钮点击视图问题答案

【问题标题】：Issue with views on button click按钮点击视图问题
【发布时间】：2015-05-09 23:53:08
【问题描述】：

我正在尝试制作一个可以上传图片的轮播。但是，当我单击上传按钮时，它会切换到另一个页面，而不是像预期的那样只给我上传选择面板。谁能告诉我为什么会这样？

Views.py

from django.shortcuts import render
from django.shortcuts import render, redirect
from django.contrib.auth import authenticate, login
from webportal.views.authentication import LoginForm
from django.shortcuts import render_to_response
from django.template import RequestContext
from django.http import HttpResponseRedirect
from django.core.urlresolvers import reverse
from django.conf import settings
from webportal.forms.forms import DocumentForm
from webportal.models import Document
is_server = True
def list(request):
    # Handle file upload
    if request.method == 'POST':
        form = DocumentForm(request.POST, request.FILES)
        if form.is_valid():
            newdoc = Document(docfile = request.FILES['docfile'])
            newdoc.save()

            # Redirect to the document list after POST
            return HttpResponseRedirect(reverse('webportal.views.list'))
    else:
        form = DocumentForm() # A empty, unbound form

    # Load documents for the list page
    documents = Document.objects.all()
    #documents=DocumentForm().
    # Render list page with the documents and the form
    return render_to_response(
        'webportal/carousel.html',
        {'documents': documents, 'form': form,},
        context_instance=RequestContext(request)
    )

轮播.html

{% load staticfiles %}
{% load filename %}
<div class="container">
    <div class="row">
        <div class="col-md-12">
            <div id="myCarousel" class="carousel slide" data-ride="carousel">
                <!-- Indicators -->
                <ol class="carousel-indicators">
                    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
                    <li data-target="#myCarousel" data-slide-to="1"></li>
                    <li data-target="#myCarousel" data-slide-to="2"></li>
                </ol>
                <div class="carousel-inner" role="listbox">
                    {% for document in documents %}
 <div class="item {% if forloop.first %} active {% endif %}"> 
    <div class="row">
      <div class="col">
        <img src = "{{STATIC_URL}}img" >
      </div>
    </div>
  </div>
  {% endfor %}
                </div>
                <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
                    <span class="glyphicon glyphicon-chevron-left"></span>
                    <span class="sr-only">Previous</span>
                </a>
                <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
                    <span class="glyphicon glyphicon-chevron-right"></span>
                    <span class="sr-only">Next</span>
                </a>
            </div>
            <!-- /.carousel -->
        </div>
    </div>
<form action="{% url 'webportal:list' %}" method="post" enctype="multipart/form-data">
            {% csrf_token %}
            <p>{{ form.non_field_errors }}</p>
            <p>{{ form.docfile.label_tag }} {{ form.docfile.help_text }}</p>
            <p>
                {{ form.docfile.errors }}
                {{ form.docfile }}
            </p>
            <p><input type="submit" value="Upload" /></p>
        </form>
</div>

表格：

class DocumentForm(forms.Form):
    docfile = forms.ImageField(label='Select a file', help_text='max. 42 megabytes')

型号：

class Document(models.Model):
    docfile = models.ImageField(upload_to='webportal/static/img/')

【问题讨论】：

你也可以发布你的表格和模型吗？
完成。添加了模型和表单
我不确定您要做什么，但是<form action="{% url 'webportal:list' %}" method="post" enctype="multipart/form-data"> 这一行会将您重定向到单击提交（上传）按钮时action 的值。您要上传照片并立即在轮播中看到它吗？
是的。就是这样。

标签： django image twitter-bootstrap upload carousel

【解决方案1】：

我不确定您所说的“仅按预期的上传选择面板”是什么意思。

首先，如果提交的表单无效，我看到您返回空表单的问题，您应该返回现有表单并显示错误。

点击上传按钮后，您的表单将向您的服务器发送一个 POST 请求，您的视图会生成一个全新的 HTML 页面作为响应。 HTTP 是无状态的，这意味着您的浏览器之前显示的任何内容基本上都不再相关。所以很自然你会看到一个新页面。

【讨论】：