将提交表单值从模态发送到另一个模态 php

Question

我正在一个 php 项目中工作，我有两个模式。第一个模态包含一个表单，提交表单后，该模态必须使用 $_POST 将表单值发送到另一个模态（将在提交后出现）。除了 $_POST 数组在第二个模式中显示为空之外，所有这些步骤都有效。我想知道是否缺少一些我必须包含的东西，或者我应该使用其他 jQuery 的东西。

这是我的代码

<button type="button" class="btn btn-red pull-right" data-toggle="modal" data-target="#newvisitor1" data-whatever="@mdo">New Visitor</button>

<!-- First Modal -->

<div class="modal fade" id="newvisitor1" tabindex="-1" role="dialog" aria-labelledby="modelLabel" aria-hidden="true" data-backdrop="static">

    <div class="modal-dialog" role="document">

        <div class="modal-content">

            <div class="modal-header">

                <h5 class="modal-title" id="modelLabel">New Visitor</h5>

                <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                    <span aria-hidden="true">&times;</span>

                </button>

            </div>

            <form id="visitorForm1" action="" method="post" role="form">

                <div class="modal-body">

                    <div class="form-group mb-4">

                        <input type="text" class="form-control" id="cpr" name="cpr" pattern="\d*" title="only numbers allowed" minlength="9" size="9" maxlength="9" placeholder="Visitor CPR" required>

                    </div>

                </div>

                <div class="modal-footer">

                    <button type="button" id="cancel1" class="btn btn-secondary" data-dismiss="modal">Cancel</button>

                    <button type="submit" id="checkVisitor" name="checkVisitor" class="btn btn-red pull-right">Check Visitor</button>

                </div>

            </form>

        </div>

    </div>

</div>

Answer 1

第一种形式不需要发送数据。您可以从第一个表单中提取值，并在提交第一个表单时将其设置在第二个表单中。不过，由于两个模式都在同一页面上，因此您需要修改第二个cpr字段的 id。否则你的 id 就会重叠，这会让它们变得毫无用处。在下面的示例中，我cpr在第二个 modal 中命名了该字段cpr2。请随意以其他方式命名。$(document).ready(function () {&nbsp; $("#visitorForm1").submit(function(event) {&nbsp; &nbsp; event.preventDefault();&nbsp; &nbsp; // Get CPR value of first modal.&nbsp; &nbsp; const cprValue = $('#cpr').val();&nbsp; &nbsp; // Set the CPR value in the second modal.&nbsp; &nbsp; $('#cpr2').val(cprValue);&nbsp; &nbsp; $('#newvisitor1').modal('hide');&nbsp; &nbsp; $('#cancel1').click();&nbsp; &nbsp; $('#newvisitor2').modal('show');&nbsp; &nbsp; return false;&nbsp; });});