用ajax+jquery的方式傳資料給前端(express)
发布于 5 年前 作者 PingStyle 7165 次浏览 来自 问答

各位好 小弟是用node express當後端的新手 做了一個web app 資料庫 是微軟 SQL資料庫 in tedious 再做一個表單傳值的時候 要如何從後端的node.js回傳正確的值給前端呢? 目前是用req.send() 或 req.end()這種方法傳給前端 但用這種方法 整個網頁版型會跑掉(變白)

有朋友建議是用ajax + jquery call api的方式就可以簡單做出來 所以我想用ajax+ jquery 的方式去用表單傳給DB ,然後讓從DB回傳的值到正確的dom上, 請問有人能推薦node.js的範例可以參考嗎…

我想先測試看看ajax的部分是否正常 但我卻一直出現alert(“失敗”); 是url的部分設定錯誤嗎? 附上程式碼 請問能給一些提示嗎? 或者有簡單的範例 謝謝各位 前端:

<html>

    <script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>        
    <script>
        function messageGo() {
            //取得 "username" 欄位值
            var username = $('#username').val();
            //取得 "message" 欄位值                             
            var message = $('#message').val();
            $.ajax({
                //告訴程式表單要傳送到哪裡                                      

                url: "http://127.0.0.1:8081/process",
                //需要傳送的資料
                data: "&message=" + message + "&username=" + username,
                //使用POST方法     
                type: "POST",
                //接收回傳資料的格式,在這個例子中,只要是接收true就可以了
                dataType: 'json',
                //傳送失敗則跳出失敗訊息  

                error: function () {
                    //資料傳送失敗後就會執行這個function內的程式,可以在這裡寫入要執行的程式  
                    alert("失敗");
                },
                //傳送成功則跳出成功訊息
                success: function () {
                    //資料傳送成功後就會執行這個function內的程式,可以在這裡寫入要執行的程式  
                    alert("成功");
                }
            });
        };
    </script>

<body>

  <form id="message_form" method="POST">

      <table id="message_table">
          <tr>
              <td>username:</td>
              <td>
                  <input type="text" name="username" id="username" /></td>
          </tr>
          <tr>
              <td>message:</td>
              <td>
                  <input type="text" name="message" id="message" /></td>
          </tr>
          <tr>
              <td>
                  <input type="button" id="submit_message" value="送出" onclick="messageGo();" />
              </td>
          </tr>
      </table>
  </form>

</body> </html> 後端:

var express = require(‘express’); var app = express(); var router = express.Router();//ajax app.use(require(‘body-parser’)());//ajax app.use(express.static(‘public’)); var bodyParser = require(‘body-parser’); // Create application/x-www-form-urlencoded parser var urlencodedParser = bodyParser.urlencoded({ extended: false }) //中間鍵 var Connection = require(‘tedious’).Connection; var Request = require(‘tedious’).Request var TYPES = require(‘tedious’).TYPES; var config = {
userName: password: server: // If you’re on Windows Azure, you will need this: options: { encrypt: true, database: ‘rent’ } }; var connection = new Connection(config); connection.on(‘connect’, function (err) { if (err) { console.log(err); // replace with your code return; };

// executeStatement();});

connection.on(‘debug’, function (err) { console.log(‘debug:’, err); console.log(‘成功囉’); });

var server = app.listen(8081, function () {
var host = server.address().address var port = server.address().port
console.log(“Example app listening at http://%s:%s”, host, port) }) app.post(’/process’, function (req, res) { 這邊成功寫出功能 把資料傳到資料庫 但不知道如何把資料回傳給前端 目前用req.send() 或 req.end() }); app.post(’/process_post’, function (req, res) {

這邊成功寫出功能 把資料傳到資料庫 但不知道如何把資料回傳給前端 目前用req.send() 或 req.end() });

1 回复

你用错了方法,get和post你自己去分一下。如果只想返回json。express可以用res.json这个方法。

回到顶部