Question

我有一个自动完成功能，工作正常，但我想延长下拉详细信息。它看起来像这样：

Datafile（form-lookup.php）：

if ($db)
{

    $fetch = mysqli_query($db,"SELECT * FROM uni_labels where label_name like '%" . $_GET['term'] . "%'");

    /* Retrieve and store in array the results of the query.*/ 
    while ($row = mysqli_fetch_array($fetch, MYSQL_ASSOC)) {

        $row_array['label'] = htmlspecialchars_decode($row['label_name']);
        $row_array['lookupid'] = $row['id'];
        $row_array['address'] = $row['label_address'];
        $row_array['number'] = $row['label_number'];
        $row_array['postalcode'] = $row['label_postalCode'];
        $row_array['country'] = $row['label_country'];

        array_push($return_arr,$row_array);
    }
}
/* Free connection resources. */
mysqli_close($db);

/* Toss back results as json encoded array. */
echo json_encode($return_arr);

我检索数据的页面如下所示：

$(function() {
        $("#step1Name").autocomplete({
            source: "/pages/form-lookup.php?country=dk",
            minLength: 2,
            select: function(event, ui) 
            {
                $('#step1Name').val(ui.item.address);  
                $('#lookupid').val(ui.item.lookupid);
                $('#vej').val(ui.item.address);
            }
        });
    });
<input  maxlength="100" type="text" required="required" class="form-control input-lg" name="step1Name" id="step1Name" />

Everyting的工作效果很好，但我希望我的下拉显示$ row_array ['label']和$ row_array ['address']，当我在下拉列表中选择一个值时，输入框将会只输出$ row_array ['label']值。

在数据文件中，我试图将地址添加到标签中，如下所示：

$row_array['label'] = htmlspecialchars_decode($row['label_name'])." - ".$row['label_address'];

这会在下拉列表中显示精确值，但在选择选项时，输入框当然包含太多数据，我只希望它显示label_name。

有人能指出我正确的方向吗？

提前致谢。

Answer 1

将此添加到您的自动填充代码：

select: function(event, ui) {
    event.preventDefault();
    var name = ui.item.value.split('-')[0];
    $("#starter").val(name);
},
focus: function(event, ui) {
    return false;
}

因此，您更新的自动填充代码将是这样的：

$("#step1Name").autocomplete({
    source: "/pages/form-lookup.php?country=dk",
    minLength: 2,
    select: function(event, ui) {
        event.preventDefault();
        var name = ui.item.value.split('-')[0];
        $("#starter").val(name);
        return false;
    },
    focus: function(event, ui) {
        return false;
    }
});

Jquery自动填充功能在下拉列表中显示更多详细信息

1 个答案: