bootstrap中模态框提交表单成功后，如果不对网页进行刷新，当再次提交表单时会提交重复数据，求解决

Posted 2023-04-12

就是希望不对页面刷新来解决这个问题

参考技术A 提交重复数据？你是没将提交的参数清空再赋值吗？（这不太可能吧）

还是你的意思是显示的数据会出现重复数据？看不到你显示数据的方法，但我猜你应该是没对之前的内容清空就直接添加了新的内容导致的，并不是“提交重复数据”的原因，你只要在显示内容之前清空一次你的显示表格就行了追问

不是从服务器获取数据的原因，因为我每次提交完都会从服务器重新获取数据，然后html（content），我是每次提交后，直接$('#dept_add_modal').modal('hide');，但我不知道要怎么清空参数

追答

你直接将显示的那部分清空再添加就好了
假如内容在div中显示
用js：document.getElementById('divid').innerHTML = '';
用jQuery：$('#divid').empty(); 或 $('#divid').html('');
然后再把显示的东西在DIV中显示（也就是调用你的显示的方法）

不知道你的显示方法代码是怎么写的，但思路就是上面那样
我要下班了，有问题星期一才能再帮你

追问

数据库里都是重复的

追答

如果你页面显示的数据和数据库中的数据一样的，那你的代码就没问题啊。

还是说你在添加数据的方法有问题，不太明白你实际要问的问题到底是什么

还有三分钟下班了

追问

哈哈，我就是要问怎么才能不会提交重复

本回答被提问者和网友采纳

python测试开发django-187.Bootstrap模态框(modal)如何在关闭时触发事件

前言

Bootstrap 模态框 (modal) 在关闭时，如何触发一些事件?比如重置表单，或者重置表单的校验。
Bootstrap 模态框 (modal) 提供了4个显示和隐藏模态框的事件。这些事件可在函数中当钩子使用。

modal 事件

下表列出了模态框中要用到事件。这些事件可在函数中当钩子使用。

事件	描述	实例
show.bs.modal	在调用 show 方法后触发。	$(’#identifier’).on(‘show.bs.modal’, function () // 执行一些动作…)
shown.bs.modal	当模态框对用户可见时触发（将等待 CSS 过渡效果完成）。	$(’#identifier’).on(‘shown.bs.modal’, function () // 执行一些动作…)
hide.bs.modal	当调用 hide 实例方法时触发。	$(’#identifier’).on(‘hide.bs.modal’, function () // 执行一些动作…)
hidden.bs.modal	当模态框完全对用户隐藏时触发。	$(’#identifier’).on(‘hidden.bs.modal’, function () // 执行一些动作…)

hide 触发

当点击隐藏模态框的时候触发

当点击右上角x按钮，或者点取消的时候调用hide.bs.modal会触发

<script>
// 模态框触发钩子 hide.bs.modal
$(function() 
    $('#myModal').on('hide.bs.modal',
    function() 
        alert('隐藏模态框的时候会触发这个事件....');
    )
);
</script>

在调用hide方法时候也会触发

$('#myModal').modal('hide')

hidden 完全隐藏模态框触发

hide.bs.modal 是模态框消失之前触发
hidden.bs.modal是模态框完全消失后触发

<script>
// 模态框触发钩子 hide.bs.modal
$(function() 
    $('#myModal').on('hidden.bs.modal',
    function() 
        alert('隐藏模态框的时候会触发这个事件....');
    )
);
</script>

关闭模态框销毁校验

模态框在关闭的时候可以执行重置校验，关于重置校验方法，可以参考前面这篇https://www.cnblogs.com/yoyoketang/p/15745490.html

$(function() 
    $('#myModal').on('hidden.bs.modal', function() 
        // 销毁校验
        var $form = $('#modal-form');
        $form.data('formValidation').destroy();
        $form.data('formValidation', null);
        // 重新调用校验方法
        validate_module_form('#modal-form')
   )
);