2014-09-04 53 views
0

我是nodejs的新手,我正在嘗試編寫測驗。現在我可以使用db.collection.find() 從集合中提取問題,但我的問題是我不想在頁面上一次顯示所有數據(即測驗問題)。我想要的是我會顯示第一個問題,然後當用戶點擊'NEXT'按鈕時,下一個問題將會顯示。nodejs-mongodb從數據庫中讀取數據後,如何一個一個地顯示數據

就像說,如果有10個問題,那麼最初只會顯示一個問題,然後當用戶點擊'NEXT'按鈕時,第二個問題將被顯示等等。

我對如何實現它缺乏想法。請幫助。

這裏是app.js

var express = require('express') 
    , routes = require('./routes') 
    , user = require('./routes/user') 
    , http = require('http') 
    , path = require('path') 
    , QuizProvider = require('./quizprovider').QuizProvider; 

var app = express(); 

app.configure(function(){ 
    app.set('port', process.env.PORT || 3000); 
    app.set('views', __dirname + '/views'); 
    app.set('view engine', 'jade'); 
    app.set('view options', {layout: false}); 
    app.use(express.favicon()); 
    app.use(express.logger('dev')); 
    app.use(express.bodyParser()); 
    app.use(express.methodOverride()); 
    app.use(app.router); 
    app.use(require('stylus').middleware(__dirname + '/public')); 
    app.use(express.static(path.join(__dirname, 'public'))); 
}); 

app.configure('development', function(){ 
    app.use(express.errorHandler()); 
}); 

var qProvider= new QuizProvider('localhost', 27017); 

//Routes 
...... 
...... 
//index 
app.get('/', function(req, res){ 
    qProvider.findAll(function(error, ques){ 
     res.render('index', { 
      title: 'Questions', 
      myquiz:ques 
     }); 
    }); 
}); 

app.listen(process.env.PORT || 3000); 

相關的代碼下面是從quizprovider.js

var Db = require('mongodb').Db; 
var Connection = require('mongodb').Connection; 
var Server = require('mongodb').Server; 
var BSON = require('mongodb').BSON; 
var ObjectID = require('mongodb').ObjectID; 

QuizProvider = function(host, port) { 
    this.db= new Db('quiz-db', new Server(host, port, {safe: false}, {auto_reconnect: true}, {})); 
    this.db.open(function(){}); 
}; 

....... 
....... 

//find all questions 
QuizProvider.prototype.findAll = function(callback) { 
    this.getCollection(function(error, quiz_collection) { 
     if(error) callback(error) 
     else { 
     quiz_collection.find().toArray(function(error, results) { 
      if(error) callback(error) 
      else callback(null, results) 
     }); 
     } 
    }); 
}; 

exports.QuizProvider = QuizProvider; 

下面相關的代碼是index.jade

extends layout 

block content 
    h1= title 
    #Questions 
     - each mq in myquiz 
     div.mq 
     div.Question= mq.Question  

     a(href="/question/new")!= "Add New Question" 
+1

至少顯示一些數據或一個概念。有辦法,但方式太廣泛,沒有合理的基礎開始。用更多信息編輯您的問題。 – 2014-09-04 09:32:07

回答

0

好朋友們終於找到了解決這個問題的方法。首先,我檢索到的記錄從myquiz到一個陣列中的JADE端使用Javascript稱爲data然後在JADE模板使用以下jQuery代碼顯示它:

$("#myquestions").html(data[0]); 
$("#option1").html(data[1]); 
$("#option2").html(data[2]); 
$("#option3").html(data[3]); 
$("#option4").html(data[4]); 
相關問題