将提交表单值从模态发送到另一个模态 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 () {

  $("#visitorForm1").submit(function(event) {

    event.preventDefault();

    // Get CPR value of first modal.

    const cprValue = $('#cpr').val();

    // Set the CPR value in the second modal.

    $('#cpr2').val(cprValue);

    $('#newvisitor1').modal('hide');

    $('#cancel1').click();

    $('#newvisitor2').modal('show');

    return false;

  });

});