使用 autocomplete.js 中的值的 id 填充隐藏的输入

Posted 2023-02-24

【中文标题】使用 autocomplete.js 中的值的 id 填充隐藏的输入

【英文标题】：populate input hidden with the id of a value from autocomplete.js

【发布时间】：2016-06-04 21:33:59

【问题描述】：

我现在正在做的是当我输入一个人的名字时自动完成。我需要的是当我选择名字时自动用那个人的 id 填充一个隐藏字段。

我的代码：

<form action="cadastroAdm.php" method="post" name="clientForm">
      <input type="text" name="clienteId" id="clienteId">   
      <input type="text" name="clienteNome" id="clientes"> 
</form>

jquery

$(document).ready(function() 
// Captura o retorno do retornaCliente.php
    $.getJSON('php/retornar_cliente.php', function(data)
    var dados = [];

    // Armazena na array capturando somente o nome do EC
    $(data).each(function(key, value) 
        dados.push(value.clienteNome);  
        );

        $('#clientes').autocomplete(
        source: dados,
        minLength: 3,   

          select: function(event, ui) 

            $('#clienteId').val(ui.item.id);
            console.log(ui.item.id);                
          ,

            );
        );
);  

retornar_cliente.php

<?php
$hostname = "";
$user = "";
$pass = "";
$basedados = "";
$pdo = new PDO("mysql:host=localhost; dbname=adv; charset=utf8;",'root','');
$dados = $pdo->prepare("SELECT clienteNome, clienteId FROM cliente ORDER BY clienteNome");
$dados->execute();
echo json_encode($dados->fetchAll(PDO::FETCH_ASSOC));
?>

在控制台日志中我只收到“未定义”.. 我做错了什么？

【问题讨论】：

console.log(ui);看看这个。

然后，$('#clienteId').val(ui.clienteId);

你只是将clientName而不是id推到dados array，这是autocomplete.push clienteId到array的来源。应该可以解决问题

如何连接它？还是推2次？

【参考方案1】：

只需用这个更改您的查询：

"SELECT clienteNome, clienteId as id FROM cliente ORDER BY clienteNome"

或者用这个改变你在JS中的变量：

ui.item.clienteId

编辑：

您没有将 id 推送到您的 dados 数组中。

请参考此链接：http://jqueryui.com/autocomplete/#remote

【讨论】：

仍然“未定义”:(

你改变了什么？

另外，您没有在 dados 数组中推送 id。请查看此内容，并参考上面我提供的链接，以便对远程数据使用自动完成功能。

我正在尝试将 id 也推送到数组，但我不知道如何将其转换为关联数组。我需要修复我的 php 语句？或者可以在jquery中做到吗？你能帮帮我吗？

这就是我提供链接的原因。使用起来很简单。

【参考方案2】：

问题解决了..按照我使用的代码：

retornar_cliente.php

<?php require_once("conexao/conexao.php"); ?>
<?php
$term = trim(strip_tags($_GET['term']));//retrieve the search term that autocomplete sends

$qstring = "SELECT clienteNome as value,clienteId as id FROM cliente WHERE clienteNome LIKE '%".$term."%'";

 $consulta_tr = mysqli_query($conecta, $qstring);
    if(!$consulta_tr) 
        die("erro no banco1");
    

while ($row = mysqli_fetch_array($consulta_tr,MYSQL_ASSOC))//loop through the retrieved values

        $row['value']=htmlentities(stripslashes($row['value']));
        $row['id']=(int)$row['id'];
        $row_set[] = $row;//build an array

echo json_encode($row_set);//format the array into json data
?>

html

<form action="cadastroAdm.php" method="post" name="clientForm">
      <input type="text" name="clienteId" id="clienteId">   
      <input type="text" name="clienteNome" id="clientes"> 
</form>

jquery

$(document).ready(function() 

        $('#clientes').autocomplete(
        source: 'php/retornar_cliente.php',
        minLength: 3,   

          select: function(event, ui) 

            $('#clienteId').val(ui.item.id);            
                 ,
            );     
        );