質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.47%

  • Node.js

    1937questions

    Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

  • Ajax

    1115questions

    Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

ExpressにおいてAjaxで送信したformデータがundefinedになってしまう

受付中

回答 0

投稿

  • 評価
  • クリップ 0
  • VIEW 986

YoshikazuAbe

score 1

一番下に記述したconsole.log(req.body.name)が「taro」等と入力してもundefinedとなってしまいます。
express@4.12.4
body-parser@1.12.4

app.js
// 必要なモジュールのロード
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var session = require('express-session')
var connect = require('connect')

// expressオブジェクトの作成
var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade');

// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

// app.use(connect.bodyParser());

app.use(express.static(path.join(__dirname, 'public')));

var routes = require('./routes/index');
var users = require('./routes/users');
var index = require('./routes/index');
var deletes = require('./routes/delete');

app.use('/', routes);
app.use('/users', users);
app.use('/delete', deletes);




// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handlers

// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: err
    });
  });
}

// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: {}
  });
});


module.exports = app;
index.jade
extends layout

block content
    script.
        function func(){
            var form = new FormData(document.querySelector("#form1"));
            var xhr = new XMLHttpRequest();
            xhr.open('POST','/',true);
            xhr.responseType = 'json';
            xhr.onload = function(e){
                if (this.status == 200){
                    var result = this.response;
                    var msg = '<table>'
                    + '<tr><td>メールアドレス:</td><td>'
                    + result.mail
                    + '</td></tr>'
                    + '<tr><td>電話番号:</td><td>'
                    + result.tel
                    + '</td></tr>'
                    + '</table>';
                    document.querySelector('#msg').innerHTML = msg;
                    }
            };
            xhr.send(form);
        }

    h1= title
    p Welcome to #{title}
    p#msg #{msg}
    form#form1(method='post',action='javascript:return false;')
        table
            tr
                td
                    p name:
                td
                    input#name(type='text',name='name')
            tr
                td
                td
                    input(type='button' value='Ajax' onclick='func();')
index.js
var express = require('express');
var router = express.Router();


/* GET home page. */
router.get('/', function(req, res, next) {
    res.render('index',{
        title:'express',
        msg: ('送信して下さい')
    })
});

var index_post = require('./index_post')
router.post('/',index_post.index)

router.get('/index/:id', function(req, res, next) {
    var id = req.params.id;
    res.render('index', { title: 'Express' ,msg:"hello" + id});
});



module.exports = router;
index_post.js
var data = {
    "taro": {
        "mail": "st@g",
        "tel": "aaa-aaa"
    }
};

exports.index = function  (req,res) {
    var name = req.body.name;
    var result = data[name];
    if (result == undefined) {
        result = {mail:'見つからない',tel:'見つからない'};
    }
    res.send(result);
    console.log(req.body.name)
    console.log(result)
};
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

まだ回答がついていません

関連した質問

同じタグがついた質問を見る

  • Node.js

    1937questions

    Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

  • Ajax

    1115questions

    Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。