为什么我的提交按钮在引导程序模型上不起作用

Question

每当我点击提交按钮时，它不会弹出(它会弹出，但只会弹出一瞬间(。连接到提交按钮的模式的目的是确保用户不会在表单中有未填充字段时重定向到下一页(通过使用验证规则(。我使用的是bootstrap、codeigner4和php。有人能帮我吗？

这是模态的代码：

<?php if (isset($validation)) :?>


<div class="modal" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">The following fields are required </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="text-danger">
<?= $validation->listErrors()?>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>

<?php endif;?>

这是按钮的代码：

<button type="submit"class="btn btn-primary me-2" id="submit" data-bs-toggle="modal" data-bs-target="#exampleModal">Submit</button>

任何帮助都将不胜感激，谢谢！

Answer 1

据我所知，如果用户没有填写所有详细信息，您希望弹出模型。实现这一点的最简单方法是首先检查是否存在任何验证错误。类似于：

<?php if($validation_errors){ ?>
<button type="button"class="btn btn-primary me-2" id="submit" data-bs-toggle="modal" data-bs-target="#exampleModal">Submit</button>
<?php }else{ ?>
<button type="submit"class="btn btn-primary me-2" id="submit">Submit</button>
<?php } ?>

更方便的是使用引导程序警报。