用ajax和php提交表单

Question

嗨,我有一个页面,让用户查看特定锦标赛和圆形的结果

用户将根据运动选择选择运动然后比赛,然后用户将选择基于比赛选择填充的比赛

完成所有操作后,用户按"提交"按钮,将根据锦标赛和所选轮次查找结果

我的代码工作得很好:

mainPage.php

<script type="text/javascript">
$(document).ready(function()
{
 $(".sport").change(function()
 {
  var id=$(this).val();
  var dataString = 'id='+ id;

  $.ajax
  ({
   type: "POST",
   url: "get_sport.php",
   dataType : 'html',
   data: dataString,
   cache: false,
   success: function(html)
   {
      $(".tournament").html(html);
   } 
   });
  });


 $(".tournament").change(function()
 {
  var id=$(this).val();
  var dataString = 'id='+ id;

  $.ajax
  ({
   type: "POST",
   url: "get_round.php",
   data: dataString,
   cache: false,
   success: function(html)
   {
    $(".round").html(html);
   } 
   });
  });

});
</script>

get_sport.php

<label>Sport :</label> 
<form method="post">
<select name="sport" class="sport">
<option selected="selected">--Select Sport--</option>
<?php
 $sql="SELECT distinct sport_type FROM events";
 $result=mysql_query($sql);
 while($row=mysql_fetch_array($result))
 {
  ?>
        <option value="<?php echo $row['sport_type']; ?>"><?php echo $row['sport_type']; ?></option>
        <?php
 } 
?>
</select>

<label>Tournamet :</label> <select name="tournament" class="tournament">
<option selected="selected">--Select Tournament--</option>
</select>


<label>Round :</label> <select name="round" class="round">
<option selected="selected">--Select Round--</option>
</select>
<input type="submit" value="View Picks" name="submit" />
</form>

get_round.php

if($_POST['id'])
{
    $id=$_POST['id'];
    $sql="SELECT DISTINCT round FROM events WHERE tournament='$id'";
    $result=mysql_query($sql);
    ?>
    <option selected="selected">Select Round</option><?php
    while($row=mysql_fetch_array($result)){
    ?>
    <option value="<?php echo $row['round'] ?>"><?php echo $row['round'] ?></option>
    <?php

    }
}
?>

例

运动=>足球; 比赛=> EPL; 圆=> 5;

假设在用户单击提交时选择了上述代码,则代码将进行查询 select results from someTable Where sport='Football' AND...

我的问题

我通过使用简单的PHP isset()函数从选择框中获取数据

if(isset($_POST['submit'])){
    echo $sport=$_POST['sport'];
    echo $tour=$_POST['tournament'];
    echo $round=$_POST['round'];
    :
    :

现在我的问题是当点击提交时一切正常但表单被重新加载,这是我不想要的

我正在寻找一个AJAX等效的isset()或一种方式来提交数据而不需要重新加载表单

任何想法/帮助将不胜感激

Answer 1

有多种方法可以避免重新加载提交表单。

解决方案是处理表单的提交操作并返回“false”（示例此处和此处）或阻止默认操作（示例此处）

您还可以将输入类型提交替换为输入类型按钮（或按钮），并处理单击按钮操作而不是处理表单提交操作。对于大多数“表单提交”问题来说，这将是一个简单的解决方法，但从语义和有效代码的角度来看，这是最糟糕的解决方案。