gpt4 book ai didi

两个字段的 jQuery/JSON 自动完成

转载 作者:行者123 更新时间:2023-12-01 03:47:14 25 4
gpt4 key购买 nike

我正在尝试 jQuery 的自动完成小部件,但遇到了麻烦。希望得到一些意见/指导。

本质上,我有一个表单,有人可以在其中输入一个人的名字...然后 jQuery 将查询数据库并建议匹配。该表单有两个需要从 JSON 数据填充的字段 - 名称字段和隐藏 ID 字段。到目前为止,我只能让它提供建议并在选择时填写名称字段,但没有运气让它更新隐藏的 ID 字段。我知道我必须从 jQuery 代码中遗漏一些关键内容,但还没有弄清楚。我尝试过使用“select”事件设置值,但没有成功。

以下是相关的FORM代码:

<div id="formblock" class="stack">
<label>Project POC: <span class="error" name="proj_poc_error" id="proj_desc_error">This field is required.</span></label>
<input type="text" name="proj_poc" id="proj_poc">
<input type="hidden" name="proj_poc_id" id="proj_poc_id" value="NOT SET">
</div>

下面是相关的 jQuery 代码:

$(function() {

$( "#proj_poc" ).autocomplete({
source: function(request, response){
$.getJSON("/includes/AJAX/GetContactNames.php?callback=?", request, function(data){
var suggestions = [];
$.each(data, function(i, val){
suggestions.push(val.contacts);
});
response(suggestions);
});
},
minLength: 2,
select: function( event, ui ){
//Should display user ID a
alert(ui.item.id + ui.item.contacts);

}

});

});

这是 GetContactNames.php 中的相关 PHP

//Initiate the session
session_start();

//Load custom classes
include_once ('../../ops.inc.php');

//Get the search term from GET
$param = $_GET['term'];

//Create new dblink class and connect to db
$uplink = new dblink();
$uplink->connect();

//Create new dbcontrol class
$control = new dbcontrol();

//Set the query to select ID and CONCAT'd NAME from Contact Table
$control->query = "SELECT `id`, CONCAT_WS(\" \",`firstname`,`lastname`) AS 'contacts' FROM `addressbook` WHERE `firstname` REGEXP '^$param'";

//Execute the query
$control->execute();

//Set an iterator value to 0
$i = 0;

//Get the results into array, then iterate.
while($row = $control->toAssocArray()){

foreach($row as $column=>$value){
$results[$i][$column] = $value;
}

$i++;

}

//Set the response string and encode for json
$response = $_GET['callback']."(".json_encode($results).")";

//Display the response string
echo $response;

//Disconnect from the database
$uplink->disconnect();

//Destroy classes
unset($uplink, $control);

GetContactNames.php 结果的输出如下所示:

([{"id":"1","name":"Santa Clause"},{"id":"2","name":"Joe Blow"}])

有什么建议吗?

最佳答案

您在源函数中构建的数据结构必须包含具有标签和值字段的对象。标签字段是自动完成菜单中显示的内容,值是选择值后将在文本字段中设置为值的内容。

这是一个搜索用户时的示例:

success: function( data ) {
response( $.map( data, function( item ) {
return {
label: item.username+" ("+item.firstname+" "+item.lastname+")",
value: item.username
};
}

在此示例中,显示的值将是用户名 + 名字和姓氏,而实际复制到文本字段中的值将只是用户名。

然后您可以在选择功能中执行此操作:

select: function( event, ui ) {
alert(ui.item.value);
}

此外,在您的代码中,我看不到 val.contacts 变量来自何处,因为在您提供的 JSON 中,对象上没有“contacts”字段...

希望这有帮助。

关于两个字段的 jQuery/JSON 自动完成,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12373419/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com