dtx3006
2018-09-05 11:22
浏览 117
已采纳

使用下拉菜单从mysql表中选择值时填充html表单

I've table calles products_tbl

+-----+------------+----------------+-------+------+-----------+
|pr_id|product_name|product_category|Price1 |Price2|product_img|
+-----+------------+----------------+-------+------+-----------+
|1    |Apple       |fruits          |12     |15    |aimg.jpg   |
|2    |Orange      |fruits          |10     |11    |orimg.jpg  |
|3    |Iphone X    |Electronics     |900    |1025  |iphimg.jpg |
|4    |FJ-Eye Lens |Accessories     |20     |25    |fjimg.jpg  |
+-----+------------+----------------+-------+------+-----------+

I've grab product_name from table and put it in Select Option and when user choose value from select option it display it image and put it in img tag (this worked perfect).

I want when user select some product name from select option it displayed the price1 and price2 in 2 text input as the same as the image

products.php

$productQ = "SELECT * FROM products_tbl ORDER BY product_category ASC";
try { 
    $stmt2 = $db->prepare($productQ); 
    $stmt2->execute();
} catch(PDOException $ex) { 
    die("Failed to run membersQ: " . $ex->getMessage()); 
} 
$produtsrows = $stmt2->fetchAll();

echo"<select name='dropdown' id='dropdown' required>
        <option selected disabled>Choose</option>";
    $category = "";
    foreach($produtsrows as $prow): 
        if ($category != $prow['product_category']) {
            if ($category != "") {
                echo "</optgroup>";
            }
            $category = $prow['product_category'];
            echo "<optgroup label=".$prow['product_name'].">";
        }
        echo"   <option value='imgs/".$prow['product_img']."'>".$prow['product_name']."</option>";
    endforeach;
    echo "</optgroup>
</select>
<input type='text' name='p1' id='p1' value=''>
<input type='text' name='p1' id='p2' value=''>

<img id='image' src='' alt=''>";

and JavaScript

<script type="text/javascript">
$(function(){
    $( '#dropdown' ).change(function(){
        $( '#image' ).attr( 'src', $( this ).val() + '' );
        $( '#p1' ).attr( 'value', $( this ).val() + '' );
        $( '#p2' ).attr( 'value', $( this ).val() + '' );
    })

});

</script>

when I select any value from select option it display the name of the image in the textbox rather than price1 and price2

how can I display the price1 and price2 rather than image name

  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

2条回答 默认 最新

相关推荐 更多相似问题