【问题标题】:How to use jQuery autocomplete with Node.js如何在 Node.js 中使用 jQuery 自动完成功能
【发布时间】:2020-07-03 14:59:39
【问题描述】:

我正在尝试使用 Node REST 服务实现 jQuery 自动完成功能,但无法正常工作。

这是我的源代码:

自动完成:

$('#search').autocomplete({
        source: function (req, res) {
            $.ajax({
                url: "http://www.example.com:3000/autocomplete",
                dataType: "jsonp",
                type: "GET",
                data: {
                    term: req.term 
                },
                success: function (data) {
                    res($.map(data.results, function (item) {
                        return {
                            label: item.id,
                            value: item.id
                        };
                    }));
                },
                error: function (xhr) {
                    alert(xhr.status + ' : ' + xhr.statusText);
                }
            });
        }    
    });

节点服务:

exports.find = function(req, res) {
var b=req.params.term;
console.log(b);
db.collection('publication', function(err, collection) {
      collection.find({type:'pub',content: new RegExp(b, 'i') }).limit(5).toArray(function(err, items) {
                res.jsonp(items);
            });
        });
};

b 在控制台中显示为未定义且自动完成功能不起作用。

【问题讨论】:

    标签: jquery rest service autocomplete


    【解决方案1】:

    如果有人需要它

    index.js

    var express = require('express'),
    autocomplete=require('./routes/autocomplete');
    
    
    var app = express();
    
    app.configure(function () {
     app.use(express.logger('dev')); /* 'default', 'short', 'tiny', 'dev' */
     app.use(express.bodyParser());
    });
    
    
    app.get('/autocomplete/:search',autocomplete.find);
    
    app.listen(6000);
    console.log('Listening on port 3000...');
    

    autocomplete.js

    var mongo = require('mongodb');
    
    var Server = mongo.Server,
            Db = mongo.Db,
            BSON = mongo.BSONPure;
    
    var server = new Server('localhost', 27017, {auto_reconnect: true});
    db = new Db('redsocial', server);
    
    db.open(function(err, db) {
        if (!err) {
            console.log("Connected to 'mydb' database");
            db.collection('publication', {strict: true}, function(err, collection) {
                if (err) {
                    console.log("error");
                }
            });
        }
    });
    
    
    exports.find = function(req, res) {
    var b=req.params.search;
    db.collection('publication', function(err, collection) {
          collection.find({type:'pub',content: new RegExp(b,'i')}).limit(5).toArray(function(err, items) {
                    res.jsonp(items);
                });
            });
    };
    

    jquery

    $('#search').autocomplete({
            source: function(req,res) {
                $.ajax({
                    url: "http://www.ejemplo.com:3000/autocomplete/"+req.term,
                    dataType: "jsonp",
                    type: "GET",
                    data: {
                        term: req.term
                    },
                    success: function(data) {
                        res($.map(data, function(item) {
                            return {
                                label: item.text,//text comes from a collection of mongo
                                value: item.text
                            };
                        }));
                    },
                    error: function(xhr) {
                        alert(xhr.status + ' : ' + xhr.statusText);
                    }
                });
            },
            select: function(event, ui) {
    
            }
        });
    

    源代码:Link

    【讨论】:

    • 对于autocomplete 已经为您完成的工作,这似乎需要做很多额外的工作。
    • @AlexanderCeballos 嘿,亚历山大,感谢您的代码。我想在商业应用程序中使用此代码。这是相对基本的,但只是想征求您的同意?不会有任何归属。请让我知道,谢谢。如果你喜欢,你可以删除这条评论
    • 好的,没问题,但如果可能的话,我想了解你的应用。
    猜你喜欢
    • 2015-06-20
    • 1970-01-01
    • 1970-01-01
    • 2017-07-21
    • 1970-01-01
    • 2011-09-10
    • 1970-01-01
    • 1970-01-01
    • 2012-09-22
    相关资源
    最近更新 更多