根据选定的下拉值

时间:2016-03-26 04:16:42

标签: javascript php html json

我有以下PHP代码将查询结果(只是产品名称及其相应单价的映射)输出到JSON文件。 PHP代码还会填充下拉列表。

我在创建JSON文件和填充下拉列表时没有问题。我主要担心的是:

当用户从下拉列表中选择产品名称时,如何自动填充另一个文本字段以显示产品的相应单价?

<label for="p_name">Product Name</label>
<div class="input-group">
  <div class="input-group-btn">
    <input type="text" class="form-control" name="p_name" id="p_name" style="width: 300px;" required>
    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> <span class="caret"></span></button>
    <ul class="dropdown-menu" role="menu" style="width: 300px;">
        <?php
            $connstring = pg_connect("host=localhost dbname=myDB user=postgres password=password")
            or die('Could not connect: ' . pg_last_error());
            $select = "SELECT p_name, unit_price FROM Product";
            $executeSelect = pg_query($select) or die('Postgresql: ' . pg_last_error());

            $result = array();

            while ($line = pg_fetch_array($executeSelect, null, PGSQL_ASSOC)) {

                $index = 0;
                foreach ($line as $col_value) {
                    if ($index % 2 == 0)
                    {
                        //Display Product Name in the drop down list
                        echo "<li><a>$col_value</a></li>";
                        $index++;
                    }
                    else
                    {
                        $index++;   
                    }


                }   
                //Store query output to the result array
                $result[] = $line;

            }

            //Save the query output to a JSON file
            file_put_contents('C:\Apache\htdocs\productList.json', json_encode($result), LOCK_EX);


            pg_free_result($executeSelect);
            pg_close($connstring);                                                              
        ?>
    </ul>
  </div><!-- /btn-group -->
</div><!-- /input-group -->     


<label for="unit_price">Unit Price</label>
<input type="number" class="form-control" name="unit_price" id="unit_price"></input>

1 个答案:

答案 0 :(得分:0)

使用Javascript显示产品的相应单价。

用于在服务器上加载JSON文件的JQuery。

$.getJSON('products.json', function(data) {
    // process the data
});

有关$.getJSON()的详情,请查看this link

提示:最好在文档的onReady()事件中加载整个JSON文件一次,并填充“产品名称”下拉框。 根据我的经验,使用PHP不是一个很好的设计选择。