自动完成从数据库输出两个字段

时间:2018-12-12 16:02:21

标签: javascript php jquery jquery-ui-autocomplete

对于自动完成输入,我有以下代码,用户可以输入员工的nome而不是ID

if (isset($_GET['term'])){
    $return_arr = array();

    try {
        $conn = new PDO("mysql:host=".DB_SERVER.";dbname=".DB_NAME, DB_USER, DB_PASSWORD);
        $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

        $stmt = $conn->prepare('SELECT * FROM colaboradores WHERE nome LIKE :term');
        $stmt->execute(array('term' => '%'.$_GET['term'].'%'));

        while($row = $stmt->fetch()) {
            $return_arr[] =  $row['nome'];
        }



    } catch(PDOException $e) {
        echo 'ERROR: ' . $e->getMessage();
    }


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

现在的输出是这样的:
enter image description here

我需要输出带有ID的名称,但只将nome信息发送到数据库

更新 这是脚本:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.min.js"></script>  
<link rel="stylesheet" href="css/autocomplete.css" />       
<script type="text/javascript">
    $(function() {  
        //autocomplete
        $(".auto").autocomplete({
            source: "search.php",
            minLength: 1,
            messages: {
                noResults: '',
                results: function() {}
        }
    });                
});
</script>

1 个答案:

答案 0 :(得分:1)

我相信您可以为自动完成功能返回标签和值:

在您的PHP中:

while($row = $stmt->fetch()) {
    // add the ID inside () chars
    $return_arr[] =  [
        'label' => $row['nome'],
        'value' => $row['id']
    ]; 
}

在您的JS中:

$(function() {
    $(".auto").autocomplete({
        source: "search.php",
        focus: function(event, ui) {
            event.preventDefault();
            // manually update the textbox
            $(this).val(ui.item.label);
        },
        select: function(event, ui) {
            event.preventDefault();
            // manually update the textbox and readonly field
            $(this).val(ui.item.label);
            $("#other-input").val(ui.item.value);
        }
    });
});

OR::您可以尝试将ID放在一些定界符中,然后在发送到数据库之前将ID去除。像这样:

if (isset($_GET['term'])){

    // strip out the (ID) before searching in DB
    $nomeOnly = preg_replace('/ \(.*\)/', '', $_GET['term']);

    $return_arr = array();

    try {
        $conn = new PDO("mysql:host=".DB_SERVER.";dbname=".DB_NAME, DB_USER, DB_PASSWORD);
        $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

        $stmt = $conn->prepare('SELECT * FROM colaboradores WHERE nome LIKE :term');
        $stmt->execute(array('term' => '%'.$nomeOnly.'%'));

        while($row = $stmt->fetch()) {
            // add the ID inside () chars
            $return_arr[] =  $row['nome'] . ' (' . $row['id'] . ')'; 
        }

    } catch(PDOException $e) {
        echo 'ERROR: ' . $e->getMessage();
    }

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