Javascript 单击时自动完成更新第二个输入框上的相同值

有人能帮我一下吗？因为大多数事情看起来都不错，比如从数据库中获取匹配结果，但当我在两个输入框上单击值时，会添加相同的自动完成值

有人能帮我解决这个问题吗

这是我的html：

<div class="col-sm-12">
    <label class="form-label-outside">From</label>
        <div class="form-wrap form-wrap-inline">
        <input id="from-input" class="form-input" name="from" type="text">
        <div id="from-show-list" class="list-group"></div>
    </div>
</div>
<div class="col-sm-12">
    <label class="form-label-outside">To</label>
    <div class="form-wrap form-wrap-inline">
        <input id="to-input" class="form-input"  name="to" type="text">
        <div id="to-show-list" class="list-group"></div>
    </div>
</div>

我的js

这里是php

require_once 'includes/config.php';

if (isset($_POST['query'])) {
    $inpText = $_POST['query'];
    $sql = 'SELECT * FROM pt_flights_airports WHERE cityName LIKE ? OR name LIKE ? OR code LIKE ?';
    $stmt = $db->prepare($sql);
    $stmt->execute(array('%'.$inpText.'%','%'.$inpText.'%','%'.$inpText.'%'));
    $result = $stmt->fetchAll();

    if ($result) {
        foreach ($result as $row) {
        echo '<a href="#" class="list-group-item list-group-item-action border-1">'.$row['cityName'].' ('.$row['code'].') - <small>'.$row['name'].'</small></a>';
    }
    } else {
        echo '<p class="list-group-item  border-1">Airport not listed!</p>';
    }
}

---

感谢您的帮助

此问题是由于链接上的单击功能引起的。通过指定包含这些链接的div的id来定义两组独立的链接

    // Set searched text in input field on click of search button
    $(document).on("click", "#from-show-list a", function() {
        $("#from-input").val($(this).text());
        $("#from-show-list").html("");
    });

    // Set searched text in input field on click of search button
    $(document).on("click", "#to-show-list a", function() {
        $("#to-input").val($(this).text());
        $("#to-show-list").html("");
    });

使用如下css将最大高度应用于结果div

<div id="from-show-list" class="list-group" style="max-height: 100px;  overflow: auto;"></div>
<div id="to-show-list" class="list-group" style="max-height: 100px;  overflow: auto;"></div>

---

请对问题作出明确解释a目前正在发生什么。如您所见，我有两个输入字段。假设我在两个输入字段中都键入了一些内容，然后从数据库显示。现在，无论我在哪个输入字段上输入1或2，如果我点击一个从数据库中得到建议的值，点击时在两个输入字段上输入相同的值，而我希望这两个字段的值都不同。啊，非常感谢@T Shah。我有最后一个问题，我如何才能使它滚动到现在它淹没了我的所有页面，如果有太多的结果。如果你能帮上忙，我将不胜感激。编辑答案，请检查。您可以更改最大高度以适应您的布局。非常感谢@T Shah，非常感谢您的时间和帮助。你把我从头痛中救了出来。

<div id="from-show-list" class="list-group" style="max-height: 100px;  overflow: auto;"></div>
<div id="to-show-list" class="list-group" style="max-height: 100px;  overflow: auto;"></div>