значение req.body не определено для значения поля формы, установленного функцией javascript - PullRequest
Новая
       6

значение req.body не определено для значения поля формы, установленного функцией javascript

0 голосов
/ 07 декабря 2018

Я создаю приложение node.js, express.js и passport.js.Зайдя в профиль, я прошу пользователя нажать кнопку «Получить местоположение», чтобы получить местоположение пользователя.

Profile.ejs 

<form action="/testform" method="post" >
  <div class="form-group">
  <input type="text" class="form-control" id="latVal" placeholder="latitude">
  <input type="text" class="form-control" id="longVal" placeholder="longitude">
  </div>
  <button type = "submit" class="btn btn-warning btn-sm">Save</button>
</form>
<button type = "submit" class="btn btn-warning btn-sm" onclick="getLocation()">Get Location</button>

при нажатии вызывается функция getLocation (), котораянаходится в mapCall.js 

function getLocation() 
 …
 //call to showLocation()
} 

function showLocation(position) {
    …
    document.getElementById("latVal").value = latitude; 
    document.getElementById("longVal").value = longitude; 
}

showLocation () устанавливает значения в форме равными широте (id = "latVal") и долготе (id = "longVal"), возвращаемым из вызова API.Значения появляются в поле формы.Отсюда я хочу сохранить эти значения в данных профиля пользователя в MongoDB, чего я пытаюсь достичь в маршрутах .js, нажав кнопку «Сохранить», которая вызывает функцию ниже 

app.post('/testform', isLoggedIn, function(req, res) {
        user.findById(req.user.id, function(err,user) {
            if(!user) {
                req.flash('error', 'No accound found');
                return res.redirect('/profile');
            }
            user.location.latitude = req.body.latVal;
            user.location.longitude = req.body.longVal;

            user.save(function(err){
                res.redirect('/profile');
            });
        });
    });

Когда я утешаю.log req.body.latVal и req.body.longVal значение для этих переменных не определено.Ничего не сохраняется в БД.

В server.js у меня есть 

var bodyParser = require('body-parser');
app.use(bodyParser());

При поиске предлагаемых решений для запроса возврата не определено Я пытался 

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

Я не думал, что добавление двух строк выше будет работать, потому что значение, возвращаемое API, не в формате JSON.Это не сработало.Я проверил typeof на широту и долготу, и это число.Я не уверен, почему req.body не берет значение.

Первоначально я предположил, что app.post пытается прочитать значение, прежде чем API сможет вернуть значение, и в этом случае req.body.latVal прочитает пустое поле.Я добавил кнопку сохранения, чтобы проверить эту теорию, которая также оказалась неверной.

Самая близкая вещь, которую я нашел к моей проблеме, это это , которая никогда не была решена.

Любое руководство высоко ценится или, возможно, будет даже лучший способ достичь этого.Причина, по которой я заполняю поля формы, заключается в том, что я не мог придумать другой способ отправки значений из внешнего интерфейса в внутренний для сохранения.

1 Ответ

0 голосов
/ 07 декабря 2018

Добавьте атрибут name к своим входам. 

<input type="text" class="form-control" id="latVal" placeholder="latitude" name="latVal">
<input type="text" class="form-control" id="longVal" placeholder="longitude" name="longVal">

РЕДАКТИРОВАТЬ: (из комментария)

Вы можете сделать AJAX-вызов на свой сервер после вызова getLocation(). 

function getLocation() {
    ///you get the lat and long
    showLocation(position)
    saveLocation(latitude, longitude)
    .then(function(resp){
        //do something with resp
    })
}
function saveLocation(latitude, longitude) {
    //we have native fetch in newer browsers, so
        return fetch("/testform", {
            method: "POST",
            headers: {
                "Content-Type": "application/json; charset=utf-8", //if this doesn't work use the below one
                // "Content-Type": "application/x-www-form-urlencoded",
            },
            body: JSON.stringify({latitude,longitude}), // body data type must match "Content-Type" header
        })
        .then(response => response.json());
}

Это всего лишь набросок того, что вы можете сделать.Расширьте этот код до ваших потребностей.

...