无法从使用 PHP 生成的 Bootstrap 选项卡中使用 AJAX 检索数据

debugcn 发表于 Dev

瑞秋浣熊

所以我有一个选择框，它触发 AJAX 调用以从显示 Bootstrap 选项卡的 MYSQL 中检索信息。我正在尝试再次调用 AJAX 以根据它们的值在每个选项卡中显示内容，但似乎无法返回结果。

这是生成选项卡的代码的一部分：

$result= $conn->query($sql);
if ($result->num_rows > 0) {
echo"
<div id=\"tabs\">
    <ul class=\"nav nav-tabs\">";
    while($row = $result->fetch_assoc()) {
    echo"
        <li class=\"nav-item\">
        <a class=\"nav-link\" id=\"gruppo\" value=\"".$row["id_gruppo"]."\" data-toggle=\"tab\" href=\"#".$row["id_gruppo"]."\">".$row["nome_gruppo"]."</a>
        <div id=\"show1\"></div>
        </li>";
      }
    echo"</ul></div>";
}

这是我附带的 AJAX 代码：

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

      $.ajax({ 
        type: "POST",
        url: "getData.php",
        data: dataString,
        success: function(result){
          $("#show1").html(result);
        }
      });

    });
  });
</script>

只是为了测试是否发生任何事情，这是页面 getData.php 的代码

 if(!empty($_POST["id_gruppo"]))
 {
  $id_gruppo=$_POST["id_gruppo"];
  echo"Gruppo:".$id_gruppo;
 }

瑞秋浣熊

感谢@Mabrouki Fakhri，我找到了解决方案。

为每个选项卡调用的函数：

<script>
   function GetDataFromDB(id_gruppo){
        $.ajax({ /* THEN THE AJAX CALL */
            type: "POST", /* TYPE OF METHOD TO USE TO PASS THE DATA */
            url: "getData.php", /* PAGE WHERE WE WILL PASS THE DATA */
            data: "id_gruppo="+id_gruppo, /* THE DATA WE WILL BE PASSING */
            success: function(result1){ /* GET THE TO BE RETURNED DATA */
            $("#home").html(result1); /* THE RETURNED DATA WILL BE SHOWN IN THIS DIV */
        }
    });
}
</script>

生成每个选项卡的代码：

  if ($result->num_rows > 0) {
        echo"
        <div id=\"tabs\">
            <ul class=\"nav nav-tabs\">";
        while($row = $result->fetch_assoc()) {
        echo"
                <li class=\"nav-item\">
                    <a class=\"nav-link\" id=\"gruppo\" onclick=\"GetDataFromDB(".$row["id_gruppo"].");\" value=\"".$row["id_gruppo"]."\" data-toggle=\"tab\" href=\"#".$row["id_gruppo"]."\">".$row["nome_gruppo"]."</a>
                </li>";
      }
            echo"
                </ul>
            </div>";
    }

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。