使用选择选项从数据库中选择相关数据,php mysql

时间:2018-11-27 17:40:46

标签: php mysql html5

数据库表“产品”具有“产品代码”和“产品名称”

我们有一个填写产品数据的表格

从数据库表列“ Product_Code”中获取选择选项

<select name="Select_Product_Code" id="Select_Product_Code"> 
    <option value="0">Product</option>
        <?php
             $con = mysqli_connect('localhost','user1db','userdb','1db');
    if (!$con) {    die('Could not connect: ' . mysqli_error($con));    }
    mysqli_select_db($con,"ajax_demo");
    $sql="SELECT * FROM Product";
    $result = mysqli_query($con,$sql);
    while($row = mysqli_fetch_array($result)) 
            {
            ?>
            <option value = "<?php echo($row['Product_Code'])?>" >
                <?php echo($row['Product_Code']);
                 ?>
            </option>
            <?php 
            } 
            ?>
    </select>

不提交表单,选择“ Product_Code”时是否可以在Label或TextInput中显示“ Product_Name”?

编辑,添加了ajax。

readproduct.php

<!DOCTYPE html>
<html>
<head>
<script>
function showProduct(str) {
  if (str=="") {
        document.getElementById("txtHint").innerHTML="";
    return;
  } 
  if (window.XMLHttpRequest) {
            xmlhttp=new XMLHttpRequest();
  } 
  xmlhttp.onreadystatechange=function() {
    if (this.readyState==4 && this.status==200) {
      document.getElementById("txtHint").innerHTML=this.responseText;
    }
  }
  xmlhttp.open("GET","getproduct.php?q="+str,true);
  xmlhttp.send();
}
</script>
</head>
<body>
<form>
<select name="products" onchange="showProduct(this.value)">
<option value="">Select </option>
<option value="1">0001</option>
<option value="2">0002</option>
<option value="3">0003</option>
<option value="4">0004</option>
</select>
</form>
<br>
<div id="txtHint"><b>list</b></div>
</body>
</html>

getproduct.php如下

    <?php
    $q = intval($_GET['q']);
    $con = mysqli_connect('localhost','user1db','userdb','1db');
    if (!$con) 
    {
        die('Could not connect: ' . mysqli_error($con));
    }
    echo "Connected";
    mysqli_select_db($con,"ajax_demo");
    $sql="SELECT * FROM Stock WHERE Product_Code = '".$q."'";
    $result = mysqli_query($con,$sql);
    while($row = mysqli_fetch_array($result)) 
    {
        echo $row['Product_Name'];
    }
    mysqli_close($con);
?>

如果我们删除where子句,则会显示所有产品名称, 带有where子句的getproduct.php不显示Product_Names。 我们错过或做错了什么?

1 个答案:

答案 0 :(得分:0)

您可以在while循环中填充一个数组,稍后将在select元素的更改侦听器中使用该数组,如下所示:

<select name="Select_Product_Code" id="Select_Product_Code"> 
    <option value="0">Product</option>
        <?php
             $con = mysqli_connect('localhost','user1db','userdb','1db');
    if (!$con) {    die('Could not connect: ' . mysqli_error($con));    }
    mysqli_select_db($con,"ajax_demo");
    $sql="SELECT * FROM Product";
    $result = mysqli_query($con,$sql);
    while($row = mysqli_fetch_array($result)) 
            {

// here it adds a name with a key that matches the option-value
            $names[$row['Product_Code']] = $row['Product_Name'];

            ?>
            <option value = "<?php echo($row['Product_Code'])?>" >
                <?php echo($row['Product_Code']);
                 ?>
            </option>
            <?php 
            } 
            ?>
    </select>

<input type="text" id="out-text" value="The Name will appear here" />

<!-- then it populates the array with json_encode() to be used in the event-listener (both below) -->
<script type="text/javascript">
var names = <?php echo json_encode($names); ?>;

document.getElementById("Select_Product_Code").addEventListener(
     'change',
     function() { 
        document.getElementById("out-text").value = names[this.selectedIndex]; 
     },
     false
  );
</script>

这不是唯一的方法,但是它具有原始的javascript / php和here is a JSFiddle的基本逻辑(减去PHP部分)