Question

因此，我一直在尝试实现一种发布项目帖子的方法，该项目能够同时上传多个图像。

我的两个表格都没有通过验证，即使它们是正确和完整的。

我不确定我在做错什么。

我的代码如下：

views.py

class CreateProjectsView(View):
    def get(self, request):
        p_photos = P_Images.objects.all()
        #project_form = ProjectsForm(initial=self.initial)
        project_form = ProjectsForm()
        context = {
            'p_photos': p_photos,
            'project_form': project_form,
        }
        return render(self.request, 'projects/forms.html', context)

    def post(self, request):
        project_form = ProjectsForm(request.POST, request.FILES)
        multi_img_form = P_ImageForm(request.POST, request.FILES)

        if project_form.is_valid() and multi_img_form.is_valid():   
            instance = project_form.save(commit=False)
            instance.user = request.user
            instance.save()
            images = multi_img_form.save(commit=False)
            images.save()

            data = {
                'is_valid': True, 
                'name': images.p_file.name, 
                'url': images.p_file.url
            }

        else:
            data = {
                'is_valid': False,
            }

        return JsonResponse(data)

forms.html

{% extends "projects/test.html" %}

{% block javascript %}

<form action="{% url 'create_post:create_projects' %}" method="POST" enctype="multipart/form-data">

    {% csrf_token %}  

    {% for hidden in project_form.hidden_fields %}
    {{ hidden }}
    {% endfor %}

    {% for field in project_form %}
    {{ field.errors }}
    {{ field }} <br />
    {% endfor %}

    <input type="submit" value="OK">

{% load static %}

{# JQUERY FILE UPLOAD SCRIPTS #}
<script src="{% static 'projects/js/jquery-file-upload/vendor/jquery.ui.widget.js' %}"></script>
<script src="{% static 'projects/js/jquery-file-upload/jquery.iframe-transport.js' %}"></script>
<script src="{% static 'projects/js/jquery-file-upload/jquery.fileupload.js' %}"></script>

{# PHOTOS PAGE SCRIPTS #}
<script src="{% static 'projects/js/basic-upload.js' %}"></script>

{# 1. BUTTON TO TRIGGER THE ACTION #}
<button type="button" class="btn btn-primary js-upload-photos">
  <span class="glyphicon glyphicon-cloud-upload"></span> Upload photos
</button>

{# 2. FILE INPUT TO BE USED BY THE PLUG-IN #}
<input id="fileupload" type="file" name="p_file" multiple
       style="display: none;"
       data-url="{% url 'create_post:create_projects' %}"
       data-form-data='{"csrfmiddlewaretoken": "{{ csrf_token }}"}'>

{# 3. TABLE TO DISPLAY THE UPLOADED PHOTOS #}
<table id="gallery" class="table table-bordered">
  <thead>
    <tr>
      <th>Photo</th>
    </tr>
  </thead>
  <tbody>
    {% for p_photo in p_photos %}
      <tr>
        <td><a href="{{ p_photo.file.url }}">{{ p_photo.file.name }}</a></td>
      </tr>
    {% endfor %}
  </tbody>
</table>

    <h1>hahahaha</h1>

</form>

{% endblock %}

basic-upload.js

$(function () {
    /* 1. OPEN THE FILE EXPLORER WINDOW */
    $(".js-upload-photos").click(function () {
      $("#fileupload").click();
    });

    /* 2. INITIALIZE THE FILE UPLOAD COMPONENT */
    $("#fileupload").fileupload({
      dataType: 'json',
      done: function (e, data) {  /* 3. PROCESS THE RESPONSE FROM THE SERVER */
        if (data.result.is_valid) {
          $("#gallery tbody").prepend(
            "<tr><td><a href='" + data.result.url + "'>" + data.result.name + "</a></td></tr>"
          )
        }
      }
    });

  });

我的终端上没有显示任何错误。只是没有任何事情发生。什么都没有上传到我的数据库。

即使正确，Django表单也未得到验证？

0 个答案: