表单元素在标签外部渲染

Question

我用laravel PHP创建了一个简单的Bootstrap 4模式，并在其中添加了一个表单。但是，当我尝试提交表单时，似乎没有这样做。经过几个小时试图找出问题所在，我认为我设法找到了问题所在。表单元素似乎在private boolean checkIsPhoneNumberInList(List<RyotMasterDb> mRyotList,String phoneNumber){ if (mRyotList == null || phoneNumber == null) { return false; } boolean isIn = false; for (RyotMasterDb rm: mRyotList) { if (phoneNumber.equals(rm.getMobile_1())||phoneNumber.equals(rm.getMobile_2())){ isIn = true; } } return isIn; } 标记之外呈现。有人知道解决这个问题的方法吗？请帮忙。

谢谢！

代码：

form

Answer 1

在form内添加modal-body标签，并使用jquery在单击按钮时提交表单

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
    <div class="modal-content">

            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>

            <div class="modal-body">
              <form id="FormExample">
                <div class="form-group">
                    <label for="exampleInputEmail1">Email address</label>
                    <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
                    <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
                </div>

                <div class="form-group">
                    <label for="exampleInputPassword1">Password</label>
                    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
                </div>
              </form>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                <button type="button" id="SaveFormexample" class="btn btn-primary">Save changes</button>
            </div>

    </div>
</div>

Jquery：

$('#SaveFormexample').click(function() {
   $('#FormExample').submit();
});

Answer 2

您编写的代码可以100％正常工作，但是...

确保：

• 您关闭了该模式组件之前的所有“表单”标签。
• 您没有将表单包含在另一个表单标签中。