contact form 7：”提交”按钮在Twitter Bootstrap Modal中不起作用

我的网站上有多个表单, 单击一个按钮即可将其加载到Bootstrap模式中。由于某些原因, 当我尝试提交表单时, 没有任何反应。我已经检查了浏览器控制台, 找不到任何错误。在error_log文件中也没有错误。

下面的代码是我的表格。我做错什么了吗？

编辑：我已经测试了另一种形式, 似乎javascript / jquery没有被加载在模式中。

<button type="button" class="application_button button" data-toggle="modal" data-target="#jobapplyform">
    <?php esc_attr_e( 'Apply for job', 'wp-job-manager' ); ?>
</button>

<div class="modal fade" id="jobapplyform" tabindex="-1" role="dialog" aria-labelledby="jobModalLabel" aria-hidden="true">                             
    <div class="modal-dialog" role="document">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close-btn-modal" data-dismiss="modal" aria-label="Close">
                    <img src="<?php echo get_stylesheet_directory_uri(); ?>/img/close-icon.png"/>
                </button>
                <h2 class="modal-title" id="jobModalLabel">Apply</h2>
            </div>                                   
            <div class="modal-body">
                <div class="application_details">
                    <?php echo do_shortcode('[contact-form-7 id="5096" title="Claim This Profile"]'); ?>
                </div>
            </div>                                 
        </div>
    </div>                               
</div>

#1

可能是你正在使用bootstrap4。

请尝试以下代码

    <!-- The Modal -->
 <!-- Button to Open the Modal -->
  <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#jobapplyform">
    Open modal
  </button>
    <div class="modal" id="jobapplyform">
        <div class="modal-dialog">
            <div class="modal-content">

                <!-- Modal Header -->
                <div class="modal-header">
                    <h4 class="modal-title">Modal Heading</h4>
                    <button type="button" class="close-btn-modal" data-dismiss="modal" aria-label="Close"><img src="<?php echo get_stylesheet_directory_uri(); ?>/img/close-icon.png"/></button>
                </div>

                <!-- Modal body -->
                <div class="modal-body">
                    <div class="application_details">
                        <?php echo do_shortcode('[contact-form-7 id="5096" title="Claim This Profile"]'); ?>
                    </div>
                </div>

                <!-- Modal footer -->
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                </div>

            </div>
        </div>
    </div>

如果没有可见性问题, 请尝试防止在提交按钮时关闭, 并检查联系表单提交按钮操作是否触发。

#2

你缺少HTML的表单元素, 并为按钮键入提交, 否则信息将不会发送到任何地方。