来自 Asp.net MVC5 中两个数据源的 Jquery UI 自动完成 [关闭]

Question

我正在开发一个 ASP.net MVC5 (C#) Web 应用程序，我试图在单个文本框中的 div 中显示来自两个不同表（一个是设备表，另一个是新闻表）的自动完成数据，例如 phonearena.com 是显示，当您输入查询时，它们会显示包含该查询的所有手机和平板电脑以及新闻和评论。

现在我可以像这样从一个数据源自动完成数据。

$(function () {
function log(message) { }

$("#search_input").autocomplete({
    source: "/Search/?term",
    minLength: 1,
    select: function (event, ui) {
        $("#mobile").val(ui.item.title);
        $("#mobile-query").val(ui.item.query);
        return false;
    }
})
.data("ui-autocomplete")._renderItem = function (ul, item) {
    return $("<li>")
    .append("<a href='/" + item.query + "'>" + item.title + "</a>")
    .appendTo(ul);
};

});

我想在 div 中显示设备和新闻列表。请在我提到的网站上查看并编写任何著名的手机，下拉 div 会弹出记录。你们能帮我解决这个问题吗？谢谢

表格结构

设备表

Device_Id-----Device_Name-----Device_Query

1-----------------iPhone 6----------------iphone_6

2-----------------Galaxy S6--------------galaxy-s6

3-----------------Lumia 990--------------lumia_990

新闻表

News_id------News_Title---------------News_Query-- --------------Device_Id

1------------iPhone 6 评测---------------iphone-6-review------------ ----------1

2------------iPhone 6 的优点和缺点----------iphone-6-pros-cons------------- ---1

3-----------Lumia 990 相机评测-------lumia-990-camera-review-----3

Answer 1

为此，您可以创建两个具有相同列名的查询并将其联合起来：

select device_name as title, device_query as query, 'device' as q_type from device_table // add your where clause here

union 

select news_title as title, news_query as query, 'news' as q_type from news_table // add your where clause here

自动完成

.data("ui-autocomplete")._renderItem = function (ul, item) {

if(item.q_type == "device")
{
// add your device type html
}
else
{
 // add your news type html
}
};