Javascript 选择标记更改时发送值并显示输出

我对使用jQuery有了新的认识

我练习使用原生PHPAJAX，但这一次我需要学习当前技术和需求的jQuery

当标记更改时，我将类型值方法POST发送到其他页面ajaxInfo.php

在select标记更改之后，它应该显示来自数据库MySQL的结果。但什么也没发生

下面是源代码

身体

jQuery AJAX

<script type = "text/javascript" >
$(document).ready(function () {
  $("select#form-types").change(function () {
    var types = $("select#form-types").val();
    if (types != null) {
      $.ajax({
          type: 'post',
          url: 'ajaxInfo.php',
          data: "types=" + types,
          dataType: 'html',
          success: function (response) {
            $("#showList").html(response);
          }
        }
      });
  });
}); 
</script>

发布页面ajaxInfo.php

<?php
if (isset($_POST["types"]) === TRUE){
    $types = $_POST["types"];
}
else{
    $types = null;
}
include '../dbco.php';
$query = $dbc -> query ("SELECT child FROM infobase WHERE parent='$types'");
if ($query -> num_rows > 0){
    echo "LIST OF : " . $types . "REGISTERED<br />";
    $count = 1;
    while ($result = $query -> fetch_assoc()){
        echo "$count" . $result['child'] . "<br />";
        count++;
    }
}else{
    echo "NO " . $types . " REGISTERED";
}
?>

---

谢谢。

您正在为选择输入字段使用id表单类型。但你的目标是另一个身份证jenis

在选择输入字段和jquery选择器中使用相同的命名id

<script type="text/javascript">
$(document).ready(function(){
    $("select#form-types").change(function(e){
        e.preventDefault();

        var types= $("select#form-types").val();

        if (types!= null)
        {
            $.ajax({
            type: 'post',
            url: 'show.php',
            data: "types=" + types,
            dataType: 'html',
            success: function(response) 
            {
                $("#showList").html(response);
            }
        }
    });
});

---

你缺少一个括号

    <script type="text/javascript">
        $(document).ready(function(){
            $("select#form-types").change(function(){

                var types= $("select#form-types").val();

                if (types!= null)
                {
                    $.ajax({
                    type: 'post',
                    url: 'ajaxInfo.php',
                    data: "types=" + types,
                    dataType: 'html',
                    success: function(response) 
                    {
                        $("#showList").html(response);
                    }
                }
            });
        });
}); // add this
    </script>

---

我发现我的ajaxjquery函数没有close对，所以我决定添加它，它就可以工作了

<script type="text/javascript">
    $(document).ready(function(){
        $("select#form-types").change(function(){

            var types= $("select#form-types").val();

            if (types!= null)
            {
                $.ajax({
                    type: 'post',
                    url: 'ajaxInfo.php',
                    data: "types=" + types,
                    dataType: 'html',
                    success: function(response) 
                    {
                        $("#showList").html(response);
                    }
                }); // Add This
            }
        });
    });
</script>

代码运行良好后，我还发现了ajaxInfo.php中的错误，循环中的计数缺少$symbol

if ($query -> num_rows > 0)
{
    echo "LIST OF : " . $types . "REGISTERED<br />";

    $count = 1;

    while ($result = $query -> fetch_assoc())
    {
        echo "$count" . $result['child'] . "<br />";
        $count++; //HERE
    }
}

---

感谢提供帮助的人。

问题出在哪里？@MehdiBounya-更改select标记后，它应该会显示来自数据库MySQL的结果。但是什么也没发生。你不应该这样做。检查控制台，告诉我是否有任何错误或show返回的值是多少。php@Gerardo-那好办法是什么？

if ($query -> num_rows > 0)
{
    echo "LIST OF : " . $types . "REGISTERED<br />";

    $count = 1;

    while ($result = $query -> fetch_assoc())
    {
        echo "$count" . $result['child'] . "<br />";
        $count++; //HERE
    }
}