我正在尝试使用Django使用模型弹出表单提交数据
forms.py
from django import forms
from .models import CollegeMaster
from bootstrap_modal_forms.mixins import PopRequestMixin, CreateUpdateAjaxMixin
class AddClgForm(PopRequestMixin, CreateUpdateAjaxMixin, forms.ModelForm):
class Meta:
model = CollegeMaster
fields = ['college_name', 'college_initials', 'logo']
models.py
from django.db import models
from django.urls import reverse
class CollegeMaster(models.Model):
college_name = models.CharField(max_length = 250,unique=True)
college_initials = models.CharField(max_length=100,unique=True)
logo = models.FileField()
def get_absolute_url(self):
return reverse('college_master:index')
def __str__(self):
return self.college_initials
这是我用于创建大学详细信息的视图类。
views.py
class CollegeCreateView(PassRequestMixin, SuccessMessageMixin,generic.CreateView):
template_name = 'college_master/create_college.html'
form_class = AddClgForm
success_message = 'Success: Book was created.'
success_url = reverse_lazy('college_master:index')
index.html
{% extends 'base.html' %}
{% block title %}College Master{% endblock %}
{% block body %}
{% include "college_master/_modal.html" %}
<div class="container-fluid">
<!-- Breadcrumbs-->
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="{% url 'home' %}">Dashboard</a></li>
<li class="breadcrumb-item active">College Master</li>
</ol>
<!-- Form Content Start-->
<div class="col-12 mb-3">
<button class="create-college btn btn-primary" type="button" name="button">
<span class="fa fa-plus mr-2"></span>Create College</button>
</div>
<!-- Form Content End -->
</div>
{% endblock %}
{% block extrascripts %}
<script type="text/javascript">
$(function () {
// Create book button
$(".create-college").modalForm({formURL: "{% url 'college_master:create_college' %}"});
});
</script>
{% endblock extrascripts %}
这是主要的html文件,用于放置表单内容,并且用户提交的点击数据不会反映到数据库中。
create_college.html
{% load widget_tweaks %}
<form method="POST" action="{% url 'college_master:index' %}" enctype="multipart/form-data">
{% csrf_token %}
<div class="modal-header">
<h3 class="modal-title">Create College</h3>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="{% if form.non_field_errors %}invalid{% endif %} mb-2">
{% for error in form.non_field_errors %}
{{ error }}
{% endfor %}
</div>
{% for field in form %}
<div class="form-group">
<label for="{{ field.id_for_label }}">{{ field.label }}</label>
{% render_field field class="form-control" placeholder=field.label %}
<div class="{% if field.errors %} invalid{% endif %}">
{% for error in field.errors %}
<p class="help-block">{{ error }}</p>
{% endfor %}
</div>
</div>
{% endfor %}
</div>
<div class="modal-footer">
<button type="submit" class="submit-btn btn btn-primary">Create</button>
</div>
</form>
这是弹出容器
_modal.html
<div class="modal fade" tabindex="-1" role="dialog" id="modal">
<div class="modal-dialog" role="document">
<div class="modal-content"></div>
</div>
</div>
问题是当我单击“提交”按钮时,数据未存储在数据库中并生成以下屏幕enter image description here