req.body.Dates не определено

Question

У меня есть 2 выпадающих меню, которые динамически заполняются с помощью SQL Server. На основе выбранных элементов я загружаю другой шаблон ejs. Я сделал это с помощью AJAX. Однако я хочу иметь возможность загружать данные в соответствии с выбранными критериями. Например, если DD1 выбрано как Andrew и DD2 как Date, таблица должна загрузить 7 столбцов на основе этих условий.

AKA

SELECT * FROM exTable x WHERE x.Name = 'Andrew' and x.Date = '4/22/2019'

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

router.js

router.post('/selection', async (req, res) =>{
  try {
    var nameFromDB = await conn.query("SELECT DISTINCT pr.Name FROM WFS.Table1 pr WHERE pr.Group = 'Test'");
    var dateFromDB = await conn.query('SELECT r.Date FROM WFS.Table2 r');
    var tables = ("SELECT * FROM WFS.view v WHERE v.Date= '" + req.body.Dates + "' AND v.Name = '" + req.body.Names + "'");
    console.log("SELECT * FROM WFS.view v WHERE v.Date= '" + req.body.Dates + "' AND v.Name = '" + req.body.Names + "'");
       res.render('selection', {tables: tables, nameFromDB : nameFromDB , dateFromDB: datesFromDB});
    } 
      catch (err) {
        res.status(500)
        res.send(err.message)
    }
 });

Это вывод console.log:

SELECT top 100 * FROM WFS.view_workRequests_Extended v WHERE v.Revenue_Release_Id = '04/16/2019' AND v.Development_Manager = 'Andrew'

app.js

var bodyParser = require('body-parser');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
    extended: true
  }));
app.use('/', router);

index.ejs

<script>
 $(document).ready(function() {
   $('#DDD').on('change', function(event) {
     var selectedDate = $('#selections option:selected').val();
   });
   $('#DDN').on('change', function(event) {
     var selectedName = $('#selection option:selected').val();
   });

   $('#submitData').on('submit', function(e){
     e.preventDefault();
     $.ajax({
       type: "POST",
       url: "/selection",
       data: {selectedDate : selectedDate, selectedName : selectedName },
       success: function() {
         alert('success');
       }
     });
   });
 });    
</script>
<form action="/selection" method="POST">
  <select class="DateDD" id="DDD" name="Dates">
    <% for(var n=0; n < dateFromDB.recordset.length; n++) { %>
      <option><%= dateFromDB.recordset[n].Date%></option>
    <% } %>
  </select>
  <select class="NameDD" id="DDN" name="Names">
    <% for(var n=0; n < nameFromDB.recordset.length; n++) { %>
      <option><%= nameFromDB.recordset[n].Name%></option>
    <% } %>
  </select>
  <input type="submit" name="Submit" id="submitData" class="btn btn-primary" value="View Report" />
</form>

selection.ejs

содержит то же самое, что и INDEX.EJS (кроме тега script) И ...

<table class="table table-bordered table-condensed table-striped">
  <% for(var n=0; n < tables.recordset.length; n++) { %>
    <tr>
      <td><%=tables.recordset[n].Name%></td>
      <td><%=tables.recordset[n].Date%></td>
      ....
      ....
    </tr>
  <% } %>
</table>

После отправки формы на index.ejs появляется эта ошибка:

Даты не определены

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

Answer 1

Вы перехватили событие onsubmit и изменили names данных, отправленных через ajax

$.ajax({
  type: "POST",
  url: "/selection",
  data: {selectedDate : selectedDate, selectedName : selectedName }, // <-- here
  success: function() {
    alert('success');
  }
});

Таким образом, вы читаете неправильное свойство в req.body.Вместо этого вы должны читать как:

// for date
req.body.selectedDate
// for name
req.body.selectedName

Также вы утверждаете

Я могу видеть имя и дату в консоли

Выводконсоли, которую вы установили, не соответствует запросу в рассматриваемом коде.

Answer 2

Это простая ошибка, так что нет ничего страшного, разочарование, насколько я знаю, может быть.

Я вижу, как вы используете даты, дату, дату и даты. Я хотел бы найти ссылку на номер строки, чтобы дать мне подсказку. Я бы использовал chrome и инструменты разработчика или console.log, чтобы посмотреть, как далеко я доберусь.

Или, я бы использовал другое соглашение об именах, например date1, date2, date3, date4 или что-то еще более описательное, так что я точно знал, какая дата была чем, тогда, сузив ошибку, будет намного проще чинить.

Answer 3

Это основной вопрос отладки.Я могу посоветовать вам сделать пару вещей, таких как:

• Проверьте браузер devTools ( вкладка сети ), чтобы увидеть, передается ли полезная нагрузка тела на сервер.
• На сервере (экспресс) вы используете промежуточное ПО body parser?подробнее здесь ( req.body section).
• Попробуйте запустить nodejs с режимом inspect и присоедините вашу IDE (VSCode - хорошийодин) и добавить несколько точек останова.В качестве альтернативы, вы можете сделать console.log с, чтобы проверить, что вы получаете от клиента.
• Вы можете смоделировать запрос браузера, используя почтальон , чтобы проверить серверную часть и убедиться, чтоработает нормально.