Question

我有两个选择列表，一个是命名产品，另一个是数量。

<select name="fish" id="fish">
    <option value="blueFish">Blue Fish</option>
    <option value="redFish">Red Fish</option>
    <option value="pinkFish">Pink Fish</option>
    <option value="greenFish">Green Fish</option>
</select>

<select name="numFish" id="numFish">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
   <option value="6">6</option>
</select>

我希望在选择产品时，相应地设置数据库中的相应数量。

因此，如果客户Billy购买了5条Pink Fish，那么当我选择Pink Fish时，数量选择列表将变为5。

这将用于使用MySQL数据库的PHP表单。

这样的功能是否可行，如果是这样，我将如何去做呢？

Answer 1

你可能想谷歌搜索ajax请求。它的作用是通过javascript检测更改（在您的情况下），将您选择的值发送到另一个php脚本，该脚本应该执行sql查询以返回数量。 ajax请求将捕获返回的值，并通过javascript再次更改选择下拉列表中的值。

所有这些都会在后台发生，您的网站也不会刷新。

如果您不习惯使用javascript，可以查看jquery框架，这样可以简化此任务，并记录大量示例。

我没有粘贴任何代码，因为假设您不熟悉javascript / jquery / ajax。您可能希望阅读一些文档并稍微玩一下，并在遇到具体问题时返回，这将是Stackoverflow中的正常工作流程。

编辑:( OP要求的一些代码）使用Javascript：

$('#fish').change(function(){
    var fishType = $('#fish select option:selected');
    $.ajax("getQuantity.php", {fish: fishType}, function(data){
        data = JSON.parse(data);
        if(data.status == "OK"){
            var quantity = data.quantity;
            $('#numFish option[value='+quantity+']').prop("selected", true);
        } else {
            alert("error");// or console.log(), whatever you prefer
        }
    }
});

php（getQuantity.php）：

<?php
    $fish = $_POST['fish']; //getting the fish type
    $sql = "your SQL to select the fish quantity for that type";
    $result = mysqli_query($mysqli, $sql);

    if(mysqli_num_rows($result)>0){
        $row = mysqli_fetch_assoc($result);
        $data = array("status" => "OK", "quantity" => $row['quantity']); // you can just output a string with the number if you want, but this way you have more control and better debugging.
        echo json_encode($data);
    }
?>

这是一个基本代码，它仍然需要捕获数据库的一些错误或返回不同的状态。但基本上就是这样。我甚至没有测试该代码，所以只能将它作为指南。

Answer 2

将<select name="fish" id="fish">更改为<select name="fish" id="fish" onchange="getQuantity(this.value);">

在javascript中声明以下函数：

function getQuantity( o ) {
   // get the quantity from the database using ajax,
   // and set the quantity dropdown here.
}

从数据库中的值设置选择列表

2 个答案: