2013-07-30 58 views
3

我想實現與節點休息服務的jquery自動完成,但我可以得到它的工作。如何使用節點j的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出現未定義的控制檯和自動完成不一樣,如果工作

回答

12

有人需要它

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

+0

這似乎是很多額外的工作'自動完成'的東西你已經爲你做了。 –

+0

看看這個http://jqueryui.com/autocomplete/#remote-jsonp –

+0

@AlexanderCeballos嘿亞歷山大,謝謝你的代碼。我想在商業應用中使用此代碼。這是相對基本的,但只是想徵求你的同意?不會有任何歸屬。請讓我知道,請幫助。那麼你可以刪除這個評論,如果你喜歡 –