表单未将更改保存在对话框模式弹出窗口Django

如何解决表单未将更改保存在对话框模式弹出窗口Django

我真的是Django的新手。我正在尝试使用表单来实现模式对话框。问题是，即使我在表单中进行了一些更改，这些更改也不会显示在数据库中……我不知道为什么。当我在“模态”对话框之外测试表单时，表单正在运行… 这是我的form.py：

class anomalie_location_form(ModelForm):
    class Meta:
        model = Anomalie
        fields = ['localization',]

这是我的观点。py

@login_required(login_url='login')
def fix_anomalie_stock(request,pk,type_anomalie):

    anomalie_pk = Anomalie.objects.get(id=pk)

    # form to change anomalie position
    form_location = anomalie_location_form(instance=anomalie_pk)
    if request.method == 'POST':
        print('printinng anomalie_location_form POST ',request.POST)
        form_location = anomalie_location_form(
            request.POST,instance=anomalie_pk)
        if form_location.is_valid():
            form_location.save()
            return redirect('/')

    context = {'anomalie_pk': anomalie_pk,'form_location': form_location}

    return render(request,"anomalie/fix_anomalie_stock.html",context)

和我的html：

<div class="modal fade" id="myModal2" role="dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4>{{product.product_name }}</h4>
            </div>
            <form action="" method="POST">
                {% csrf_token %}
                <div class="modal-body">
                    {{form_location}}
                </div>
                <div class="modal-footer">
                    <input type="submit" class="btn btn-primary" value="Treter" data-dismiss="modal">
                </div>
            </form>
        </div>
    </div>
</div>

这是模型。py

class Anomalie (models.Model):
    ANOMALIE = (
        ("Etiquette absente","Etiquette absente"),("Etiquette decalee","Etiquette decalee"),("Etiquette inconnue","Etiquette inconnue"),)

    ANOMALIE_STATE = (
        ("traité","traité"),("mise à jour","mise à jour"),("signalé","signalé"),)
    type = models.CharField(
        max_length=200,choices=ANOMALIE,null=False)
    date_report = models.DateTimeField(null=False,blank=False)

  
    localization = models.TextField(max_length=30,null=False,blank=False)
    state = models.CharField(
        max_length=200,choices=ANOMALIE_STATE,null=False)
  
    aisle = models.ForeignKey(Aisle,null=True,on_delete=models.SET_NULL)
    product = models.ForeignKey(
        Product,on_delete=models.SET_NULL)
   

    def datepublished(self):
        return self.date_report.strftime('%B %d %Y')

    def __str__(self):
        return self.type

这是url.py

urlpatterns = [
    path('admin/',admin.site.urls),path('',home_screen_view,name="home"),path('consult/<str:pk>/',consult_anomalie,name="consult_anomalie"),path('fix_anomalie_stock/<str:pk>/<str:type_anomalie>',fix_anomalie_stock,name="fix_anomalie_stock"),]

所以问题是为什么表单在Dialog Modal之外工作？

解决方法

错误很简单。

也就是说，模式中的表单具有一个提交按钮。此按钮具有引导程序模式data-dismiss属性，该属性使模式消失，而不是要提交的表单。

<input type="submit" class="btn btn-primary" value="Treter" data-dismiss="modal">

从“提交”按钮中删除引导程序data-dismiss属性。

<input type="submit" class="btn btn-primary" value="Treter">

运行中的代码段

运行代码片段以查看其运行情况。我从问题中添加了模式代码。表单submit()用于警告表单数据，'hidden.bs.modal'用于在模式关闭时警告。出于演示目的，表单具有两个提交按钮。一个带有data-dismiss属性，另一个没有。您会看到按钮（2）会警告数据，而另一个按钮会关闭模式

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet"/>

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal2">
  Launch modal
</button>

<div class="modal fade" id="myModal2" role="dialog">
  <div class="modal-dialog modal-lg">
      <div class="modal-content">
          <div class="modal-header">
              <h4>Product Name</h4>
          </div>
          <form action="" method="POST">
              <div class="modal-body">
                  <input type="text" name="product" class="form-control">
                  (1) submit button with data-dismiss attribute<br>
                  (2) submit button without data-dismiss attribute
              </div>
              <div class="modal-footer">
                  <input type="submit" class="btn btn-primary" value="(1) Treter" data-dismiss="modal"> | <input type="submit" class="btn btn-primary" value="(2) Treter">
              </div>
          </form>
      </div>
  </div>
</div>
    
<script>
  $(document).ready(function() {
    console.log('start');
    $('form').submit(function() {
      alert($(this).serialize());
    })

    $('#myModal2').on('hidden.bs.modal',function (e) {
      alert('modal closes');
    })
  });
</script>

我缺少一些细节，但是当输入未命名时，表单通常无法正确提交。甚至您的选择元素也需要名称和值对参数。你仔细检查了吗？

使用引导程序会发生什么，那就是模态会混淆表单动作。您现在将其设置为=“”。尝试删除操作参数，并为您的表单提供唯一的ID。

if request.method == 'POST':

还尝试检查是否发布了提交按钮，而不仅仅是发布请求方法。

模块应该位于form标记内，而不是相反。

<form action="" method="POST">{% csrf_token %}

<div class="modal fade" id="myModal2" role="dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4>{{product.product_name }}</h4>
            </div>
                <div class="modal-body">
                    {{form_location}}
                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-secondary" data dismiss="modal">Close</button>
                 <button type="submit" class="btn btn-primary">Save changes</button>
                </div>
        </div>
    </div>
</div>

</form>

表单未将更改保存在对话框模式弹出窗口Django

如何解决表单未将更改保存在对话框模式弹出窗口Django

解决方法

相关推荐