Question

我从mysql数据库中获取数据列表，我将其添加到选择列表中。当用户选择一个选项时，我想从所选项中获取ID，并使用它来引用我的结果数组的索引，如下所示：

echo $results[$id]['fruit'];

我使用$ results = $ stmt-＆gt; fetchAll（PDO :: FETCH_UNIQUE）从数据库中检索数据，因此选择列表的每个id都是记录的主键。

所以我读到我可以使用AJAX获取所选项的值并将其作为POST变量发送回来，然后我可以在PHP中访问它。但是，当我去打印这个变量时，我什么都没得到。

if(isset($_POST['id']))
{
    $id = $_POST['id']; 
    echo $id; //prints nothing
}

这是我的代码：

<html>
<head>
    <script
    src="https://code.jquery.com/jquery-3.3.1.min.js"
    integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
    crossorigin="anonymous">
    </script>
    <script>
        function listChange() {
            var recID = document.getElementById("fruits").value;
            $.ajax({
                method: 'POST',
                data: {'id' : recID},
                dataType: "json",
                success: function(response)
                {
                    console.log(response);
                }
            });
        }
    </script>   
</head>
<body>
    Fruits
    <select id="fruits" name="fruits" onchange="listChange()">
        <option value="0">Apple</option>
        <option value="1">Pear</option>
        <option value="2">Watermelon</option>
        <option value="3">Orange</option>
    </select>
    <br/><br/>
    My Fruit <input type="text" id="myfruit">
    <?php
    if(isset($_POST['id']))
    {
        $id = $_POST['id']; 
        echo $id;  //does not print however post is working if you look in firefox -> web developer -> developer toolbar -> network

        //the id will be used to reference a variable 
        //$results[$id]['fruit'] which I got 
        //from a database like this 
        //$results = $stmt->fetchAll(PDO::FETCH_UNIQUE);
        //this value will set the text field myfruit
    }
    ?>
</body>
</html>

Answer 1

我想你可以试试这个

$(document).ready(function(){  
    $("#fruits").change(function(){
     var fruitValue = $(this).val(); // for the value i.e 0,1,2,3
     var fruitTect = $(this).text(); // for text i.e. Apple, Pear,...
    // then now you can do ur ajax
     $.ajax({
       // Your Code For Post goes here
    });

    });
});

无需在html中调用onchange函数。 Jquery会处理剩下的事情

也是你的设置（$ _ POST [＆＃39; id＆＃39;]）也许是设置（$ _ POST [＆＃39; fruits＆＃39;]）

Answer 2

尝试在HMTL中使用此代码。

<html>
   <head>
       <script
       src="https://code.jquery.com/jquery-3.3.1.min.js"
       integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
       crossorigin="anonymous">
       </script>
        <script>
            function listChange(obj) {
                 var recID = obj.value;
                 var recID = $("#fruits:selected").text();
                 $.ajax({
                     method: 'POST',
                     data: {'id' : recID},
                     url:'demo.php',(put url of php file and remove in this file make diffrent php file)
                     dataType: "json",
                     success: function(response)
                     {
                         console.log(response);
                     }
                 });
             }
         </script>   
     </head>
    <body>
         Fruits
         <select id="fruits" name="fruits" onchange="listChange(this)">
             <option value="0">Apple</option>
             <option value="1">Pear</option>
            <option value="2">Watermelon</option>
             <option value="3">Orange</option>
         </select>
         <br/><br/>
         My Fruit <input type="text" id="myfruit">
         <?php
         if(isset($_POST['id']))
         {
             $id = $_POST['id']; 
             echo $id;  //does not print however post is working if you look in firefox -> web developer -> developer toolbar -> network

             //the id will be used to reference a variable 
             //$results[$id]['fruit'] which I got 
             //from a database like this 
             //$results = $stmt->fetchAll(PDO::FETCH_UNIQUE);
             //this value will set the text field myfruit
         }
         ?>
    </body>
</html>

Answer 3

罗杰斯回答是对的。你错过了ajax调用中的url参数。

function listChange() {
  var fruitValue = $(this).val(); // for the value i.e 0,1,2,3
        $.ajax({
            url: '/myPhpFile.php',
            method: 'POST',
            data: {'id' : fruitValue},
            dataType: "json",
            success: function(response)
            {
                console.log(response);
            }
        });
    }

如果你真的想在一个文件中调用它，你必须将php代码置于顶层，并在条件完成后退出..

<?php
  if(isset($_POST['id']))
  {
    $id = $_POST['id'];

你需要编码为ajax期望一个json数据

$results_array = array("Id" => $id):
$json=json_encode( $results_array );
header('Content-Type: application/json'); //tell the broswer JSON is coming
echo $json; //Just plain vanillat JSON output

在这里做你的事情退出。请注意，每个echo“something”都会伪造ajax调用所期望的json数据

exit();
}
?>

Answer 4

好的，我找到了一种更简单的方法。只需在更改选择时让Javascript对URL中的值进行编码，然后使用GET在PHP中访问它。

在Javascript中编码网址：

<script>
        $(document).ready(function(){  
            $("#fruits").change(function(){
                 var fruitValue = $(this).val(); 
                 window.location.href="ajax.php?id=" + fruitValue;
            });
        });
</script>

回显PHP中的值：

if(isset($_GET['id']))
{
    $id = $_GET['id']; 
    echo $id;  
}

Answer 5

通过不同的文件打印数据。 Php返回数据发送到另一个文件，ajax响应数据打印在html中。

行动档案

if(isset($_POST['id']))
{
     $id = $_POST['id']; 
     echo $id; //prints nothing
}

查看档案

function listChange() {
        var recID = document.getElementById("fruits").value;
        $.ajax({
            url: 'action.php',
            method: 'POST',
            data: {'id' : recID},
            dataType: "json",
            success: function(response)
            {
                $('#your_id').html(response);
            }
        });
    }

OR

<html>
<head>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous">
</script>
<script>
    function listChange() {
        var recID = document.getElementById("fruits").value;
        $("#your_id").html(recID);
    }
</script>   
</head>
<body>
Fruits
<select id="fruits" name="fruits" onchange="listChange()">
    <option value="0">Apple</option>
    <option value="1">Pear</option>
    <option value="2">Watermelon</option>
    <option value="3">Orange</option>
</select>
<br/><br/>
My Fruit <input type="text" id="myfruit">
<div id="your_id"></div>
</body>
</html>

Answer 6

<script>
     function listChange() {
                var recID = document.getElementById("fruits").value;
                $.ajax({
                    url:'ajax.php'
                    method: 'POST',
                    data: {'id' : recID},
                    success: function(response)
                    {
                        console.log(response);
                    }
                });
            }

</script>

<?php

print_r($_POST);

?>

无法使用PHP

6 个答案: