使用 Geonames 和 MYSQL 的 JQuery 自动完成

Question

我试图创建一个多功能搜索栏，不仅可以查找城市（使用 Geonames），还可以使用相同的输入字段来查找注册用户（使用我的 MYSQL 表。

我设法分别实现了两者，但是我无法将代码合并在一起。

geoname 自动完成的 JQuery 代码：

$(function() {
$( "#top_search_field" ).autocomplete({
    source: function( request, response ) {
        $.ajax({
            url: "http://api.geonames.org/searchJSON?username=dummie",
            dataType: "jsonp",
            data: {
                featureClass: "P",
                style: "full",
                country: "AT",
                maxRows: 12,
                name_startsWith: request.term
            },
            success: function( data ) {
                response( $.map( data.geonames, function( item ) {
                    return {
                        label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
                        value: item.name
                    }
                }));
            }
        });
    },
    minLength: 2,
    select: function (event, ui) {
        var selectedObj = ui.item;
        jQuery("#top_search_field").val(selectedObj.value);
        return false;
    },

    open: function () {
        jQuery(this).removeClass("ui-corner-all").addClass("ui-corner-top");
    },
    close: function () {
        jQuery(this).removeClass("ui-corner-top").addClass("ui-corner-all");
    }
});
});

从表格中抓取用户的代码：

$(function() {

$( "#top_search_field" ).autocomplete({
     source:'php_includes/search.php',
     minLength: 2,
     open: function () {
        jQuery(this).removeClass("ui-corner-all").addClass("ui-corner-top");
    },
    close: function () {
        jQuery(this).removeClass("ui-corner-top").addClass("ui-corner-all");
    }
})


});

搜索.php

include_once("db_connect.php");

$stmt = $db_connect->query("SELECT user_auth, first_name, last_name, avatar FROM users WHERE (first_name LIKE '%".$_REQUEST['term']."%' OR last_name LIKE '%".$_REQUEST['term']."%') ");

while($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
$results[] = array('label' => utf8_encode($row['first_name'].' '. $row['last_name'] ) );
}

echo json_encode($results);

---

将代码合并在一起并可以同时查找城市和用户的最佳方式是什么？

Answer 1

您需要执行一项服务以从多个服务中获取信息，将它们组合起来并响应您的自动完成结果。假设您有一个名为advanced_search.php 的服务。在这个文件中；

<?php
$keyword = $_GET["keyword"];
$result = array();

$usersReturnedFromService = getUsersFromService($keyword); // Get users from service by using curl

foreach ($usersReturnedFrom as $user) {
    array_push(array("type" => "user", "value" => $user));  
}

$geoNamesReturnedFromService = getGeoNamesFromService($keyword); // Get geonames from service by using curl

foreach ($geoNamesReturnedFromService as $geoname) {
    array_push(array("type" => "geoname", "value" => $geoname));    
}


// When you sort, result will mixed 
function compareArr($a, $b){
    $ad = strtotime($a['value']);
    $bd = strtotime($b['value']);
    return ($ad-$bd);
}

usort($result, 'compareArr');

echo json_encode($result);

在js端；

$(function() {
    $( "#top_search_field" ).autocomplete({
        source: function( request, response ) {
            $.ajax({
                url: "advanced_search.php?keyword=" + request.term, // put other variables here. I have only put term
                success: function( data ) {
                    response( $.map( data, function( item ) {
                        return {
                            label: item.value, // john
                            value: item.type + "|" + item.value // user|john
                        }
                    }));
                }
            });
        },
        minLength: 2,
        select: function (event, ui) {
            var selectedObj = ui.item;
            jQuery("#top_search_field").val(selectedObj.value);
            return false;
        },

        open: function () {
            jQuery(this).removeClass("ui-corner-all").addClass("ui-corner-top");
        },
        close: function () {
            jQuery(this).removeClass("ui-corner-top").addClass("ui-corner-all");
        }
    });
});