Question

这是一个奇怪的问题：我的模态完美无缺，直到我将包含它的模板与CreateView相关联！例如，如果我将template_name中的BrandCreateView更改为new_brand_form1.html，new_brand_form2.html将完全加载到模态中。但是现在，当我点击触发模态的按钮时，I get this。

views.py：

class BrandCreateView(SuccessMessageMixin ,generic.edit.CreateView):

    template_name = 'new_brand_form2.html'
    model = Brand
    fields = ['name']


    def get_success_url(self):
        current_business = Business.objects.filter(owner=self.request.user).first()

        current_business.brands.add(self.object.pk)
        return reverse_lazy('index', kwargs={'pk': self.object.pk})

    # pre assign-current business to the business field
    def get_initial(self):
        initial = super().get_initial()
        initial['business'] = Business.objects.filter(owner=self.request.user).first()
        self.business_name = initial['business']
        return initial

    def form_valid(self, form):
        form.instance.user = self.request
        form.instance.business = self.business_name
        try:
            return super(BrandCreateView, self).form_valid(form)
        except IntegrityError:
            form.add_error('name' ,'You already have a brand by that name')
            return self.form_invalid(form)

new_brand_form2.html：

<div class="modal fade" tabindex="-1" role="dialog" id="createbrand">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
        <form class="form-horizontal">
            {{ form.as_p }}
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div>

编辑：

这可能是问题吗？触发模态的按钮显然指向与urls.py中的CreateView相关联的URL（名为'createbrand`），也许它正处于一个未结束的循环中？？

这是触发模态的按钮

<button class="btn btn-default btn-sm" type="button" data-toggle="modal" href="{% url "createbrand" %}"  data-target="#createbrand">
   <span class="glyphiconglyphicon-plus">Add New</span>
</button>

Answer 1

您是否尝试将href attr设为HTML button tag？

无论如何，点击后点击你的按钮就像bootstrap-modal一样，因为你需要添加所有属性。这就是为什么你可能会在你的页面中进行一些bootstrap-modal表演的原因。但事实上，它无法在您的网页中找到data-target="#createbrand"，因为您的模态位于其他地方：）

试试这些：

modal-snippet.html：

<div class="modal fade" tabindex="-1" role="dialog" id="createbrand">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <form method="POST" action="{% url 'createbrand' %}" class="form-horizontal" id="brandForm">
      <div class="modal-body">

            {% csrf_token %}
            <input type="text" id="id_your_field_name"  name="your_field_name" placeholder="Enter..."/>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="submit" class="btn btn-primary">Save changes</button> <!-- onclick="addBrand()" -->
      </div>
      </form>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div> 

{% block javascript %}
// You can use also AJAX request, but you 
// need to change your view and add onclick for this method to button
function addBrand(e){
    var brandForm = $("#brandForm");

    $.ajax({
        type: 'POST',
        url: "{% url 'createbrand' %}",
        data: brandForm.serialize(),
        success: function(res){
            if(res.msg !== "Error") {
               // Do something if error
            } else {
               // Do something if success
            }
    }
})}
{% endblock javascript %}

views.py：

// I believe you can make it better
def add_brand(request):
    if request.method == "POST":
        form = BrandForm(request.POST)

        if form.is_valid():
            form.save(commit=True)
    return reverse_lazy('your-page')

urls.py：

...

from .views import add_brand
url(r'^url/path/$', add_brand, name='createbrand'),

...

在您要放置模态的主页面中添加：

{% include 'app/snippets/modal-snippet.html' %}

Django CreateView混淆了bootstrap-modal

1 个答案: