Question

我有一个PHP页面，显示了许多记录。

在页面上，我有两个提交按钮：一个用于下一页，一个用于（在引导模式中），用于将数据导出到另一个数据库。

下一页的HTML是：

<form method="post" action="mypage.php" />
Jump to Page:
<select name="page"">
<option value="1" selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<input type="submit" value="Go" />
</form>

这是（bootstrap）模式中代码的一部分：

<div class="modal-body">
<form data-async data-target="#modal" action="import.php" method="POST">
<div id="modal" class="alert alert-success" style="font-size:13px;">Please enter the requested data!</div>
<div class="tabbable">
  <ul class="nav nav-tabs">
    <li class="active"><a href="#pane1" data-toggle="tab" style="font-size:13px;">Project</a></li>
    <li><a href="#pane2" data-toggle="tab" style="font-size:13px;">Summary</a></li>
    <li><a href="#pane3" data-toggle="tab" style="font-size:13px;">Personal</a></li>
    <li><a href="#pane4" data-toggle="tab" style="font-size:13px;">Details</a></li>
    <li><a href="#pane5" data-toggle="tab" style="font-size:13px;">Notification</a></li>
  </ul>
  <div class="tab-content">
   <div id="pane1" class="tab-pane active">
        <input type="hidden" name="ticketId" id="ticketId" value=""/>
    <p>Please select the project you want to file the report under.</p>

       <select style="width:350px;" class="chzn-select" name="project">
        <option value=""></option>
        <option>Project 1</option>
            <option selected>Project 2</option>
            <option>Project 3</option>
            <option>Project 4</option>
           </select>
       <p class="note">Note: You can change this later.</p>


[... content skipped ...]


  </div><!-- /.tab-content -->

</div><!-- /.tabbable -->
</div>
<div class="modal-footer">
    <input type="submit" class="btn btn-primary" value="Create Report" />
    <a href="#" class="btn" data-dismiss="modal">Close</a>
</div>
</div>
</form>

在模态窗口页面的标题中，我有这个javascript：

<script>
jQuery(function($) {
$('body').on('submit','form[data-async]', function(event) {
        alert('submit Event');
        var $form = $(this);
        var $target = $($form.attr('data-target'));
        $.ajax({
            type: $form.attr('method'),
            url: $form.attr('action'),
            data: $form.serialize(),

            success: function(data, status) {
                $target.html(data);
            }
        });
        event.preventDefault();
        $('#addBookDialog').delay(2000).fadeOut('slow');
        location.reload(true);
    });
});
</script>

BTW使用简单的PHP调用下一页，查询数据库以获取新记录。

问题在于：当我点击模态中的提交按钮时，数据将使用import.php导出到其他数据库。大。但是当我使用第一个按钮（下一页或另一个）时，请求也会发送到import.php，而它只是应该显示另一个页面。

所以我的问题是：如何使用Jquery函数从模态窗口导出信息，以及第一个（页面）提交按钮如何调用下一页或其他页面。

如果您有任何疑问，请告诉我。

干杯！

Answer 1

如果您不想提交表单，为什么要使用提交进入下一页？要拨打下一页，请使用简单的链接。

如何使用Jquery，PHP和MySQL在一个页面上使用两种不同的表单

1 个答案: