【问题标题】:autocomplete jquery multiple fields onchange or tab event自动完成 jquery 多个字段 onchange 或 tab 事件
【发布时间】:2016-07-09 01:00:37
【问题描述】:

所以,我的 php 页面中有这个 jquery 代码,它从 mysql 表中获取数据:

$(function() {
    $("#tracking_num").autocomplete({
        source: "func/populate.php",
        minLength: 2,
        select: function(event, ui) {
            $('#name').val(ui.item.name);
            $('#particulars').val(ui.item.particulars);
            $('#remarks').val(ui.item.remarks);
            $('#location').val(ui.item.location);
        }
    });
});

我面临的挑战是无需从下拉框中选择即可立即将数据放入字段中。你们知道怎么做吗?这是我的 func/populate.php 文件:

$return_arr = array();

$fetch = mysql_query("SELECT * FROM tbl_document WHERE tracking_number = '" . mysql_real_escape_string($_GET['term']) . "' ORDER BY id DESC LIMIT 1");

while ($row = mysql_fetch_array($fetch) ) {
    $row_array['name'] = $row['name'];
    $row_array['particulars'] = $row['particulars'];
    $row_array['remarks'] = $row['remarks'];
    $row_array['location'] = $row['location'];
    $row_array['value'] = $row['tracking_number'];

    array_push($return_arr,$row_array);
}

mysql_close();

echo json_encode($return_arr);

【问题讨论】:

  • 你能显示select的html部分吗?

标签: javascript php jquery mysql autocomplete


【解决方案1】:

你试过了吗:

$(function() {
    $("#tracking_num").autocomplete({
        source: "func/populate.php",
        minLength: 2,
        create: function(event, ui) {
            $('#name').val(ui.item.name);
            $('#particulars').val(ui.item.particulars);
            $('#remarks').val(ui.item.remarks);
            $('#location').val(ui.item.location);
        }
    });
});

?

【讨论】:

  • 感谢@Stan 的回答。我再解释一下。这是我遇到的一个 jquery 自动完成问题。当您在此文本框中键入内容时会出现下拉列表:<input type = "text" name = "tracking_num" id = "tracking_num" placeholder = "Enter the Tracking No"> 该下拉列表列出了 mysql 数据库中的数字。当您从下拉列表中选择一个数字时,它将填充其下方的其他文本框。问题是,我不喜欢“从下拉列表中选择”部分,因为大多数跟踪号都与我的数据库匹配。如果我只是点击 Tab 并且数据将填充到文本框会更好。
猜你喜欢
  • 1970-01-01
  • 2013-04-05
  • 1970-01-01
  • 2013-07-12
  • 2023-03-23
  • 1970-01-01
  • 2012-11-16
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多