codeigniter - 如何使用 html & JS (onChange() ) 在第二个文本框中设置数据列表选项值

Question

我有 1 个包含食品名称和第二个文本框的数据列表来显示所选食品的价格。我不明白如何使用 js 在 datalist 上创建一个函数来 onChange 在文本框 txtprice 中显示价格。

#I'm using codeigniter  


<input list="browsers" id="browser" name="browser">
                <datalist id="browsers" onchange="getComboA(this)">
                    <?php foreach($h as $row){ ?>
                        <option value="<?php echo $row->price;?>" >                         
                            <?php echo $row->menu_name;?>
                        </option>
                    <?php } ?>
                </datalist>

<div class="col-12 col-md-2"><input type="text" placeholder="Price"  class="form-control" id="txtPrice" name="txtPrice" value="<?php echo $row->price;?>" readonly >
</div>

例如：项目名称- Panner Tikka | 价格 - 150

标签： codeigniter

Answer 1

它非常易于onchange()使用JS

用于this.value获取datalist选项何时更改的值

<datalist id="browsers" onchange="PutValue(this.value)">
<?php foreach($h as $row){ ?>
    <option value="<?php echo $row->price;?>" >                         
        <?php echo $row->menu_name;?>
    </option>
<?php } ?>

JS

function PutValue(Value){
    $('#input_field_id').val(Value);
}