2016-04-18 14 views
1

NodeとExpressを使用して1ページのアプリケーションを作成しました。このページにはいくつかのセクションがあり、それぞれにフォームがあります。私は各フォームのデータをMongoにPOSTしますが、ページを更新せずに同じページにとどまるレスポンスを探したいと思います。ここに私のルータのコードです:Node.js、Express、MongoDBスタック:応答が同じページに残りたい

/* POST data to visitorSessionsTest collection */ 

router.post('/datasubmit', function(req, res) { 

    // Set internal DB variables 
    var db = req.db; 

    // Get form values. 
    var questionId = req.body.questionId; 
    var visitorData = req.body.visitorData; 

    // Set collection 
    var collection = db.get('visitorSessionsTest'); 

    // Submit to the DB 
    collection.insert({ 
     "questionId" : questionId, 
     "visitorData" : visitorData 
    }, function (err, doc) { 
     if (err) { 
      // If it failed, return error 
      res.send("There was a problem adding the information to the database."); 
     } 
     else { 
      // what can go here? 

     ); 
     } 
    }); 
}); 

さらに良いデータが収集されたことを反映し、そのページ上の適切なセクションでのdivに応答ライトinnerHTMLプロパティを持っているだろう。

UPDATEクライアント側のコードは、ジェイドに始まるが、このような入力、とフォームのシリーズに関連する部分の金額:

<form id="data-submit" name="datasubmit" method="post" action="/datasubmit"> 
<button name="visitorData" value="16" type="submit" onclick="showMessage(0)">16</button> 
.... 
+1

ajaxを使用します。投稿を呼び出す/ ajaxを介して取得します。応答が受信されたら、jqueryを使用してdivを応答 – FRizal

答えて

1

あなたはRESTfulなAPI上に読みたいようなものだビットサウンズ;この種のものには、ノード固有ではない一般的なアプローチがたくさんあります。

私があなたの場所でやっていることは、後でナビゲートするために必要なものを含めて、作成されたオブジェクトのコピーと共に、201(「作成済み」)レスポンスを送信することです。 GETルートはオブジェクトIDに基づいています)。

+0

に更新しました。これを試しましたが、http:// localhost:3000/datasubmitにブラウザを送信しました。 – interwebjill

+0

クライアント側のコードはどのようなものですか? – Paul

0

リダイレクトされる理由は、ボタン上にtype="submit"があるためです。それを削除してフォームをajax経由で送信すると、次のページには転送されません。

関連する問題