Как написать в базу данных MongoDB из EJS, Javascript? - PullRequest
Новая
       2

Как написать в базу данных MongoDB из EJS, Javascript?

0 голосов
/ 06 марта 2019

Я довольно новичок в разработке веб / серверов и меня немного смущает вызов кода из ejs. У меня есть таблица, и я хочу, чтобы кнопка была в каждом ряду. Я хочу, чтобы после нажатия кнопки он удалял конкретный элемент из MongoDB (я использую Mongoose, NodeJS, Bootstrap Table, EJS). Это мой код и кнопка 

'<a class="remove" href="javascript:void(0)" title="Remove">',
        '<i class="fa fa-trash"></i>',
        '</a>'

- кнопка для удаления строки: 

<table id="table">
    <thead>
      <tr>
        <th data-field="name">Device name</th>
        <th data-field="receivingKey">Receiving key</th>
        <th data-field="operate" data-formatter="operateFormatter" data-events="operateEvents"></th>
      </tr>
    </thead>
  </table>

  <script>
    var $table = $('#table');
    var data = <%- JSON.stringify(devices) %>;

    function operateFormatter(value, row, index) {
      return [
        '<a class="like" href="javascript:void(0)" title="Like">',
        '<i class="fa fa-heart"></i>',
        '</a>  ',
        '<a class="remove" href="javascript:void(0)" title="Remove">',
        '<i class="fa fa-trash"></i>',
        '</a>'
      ].join('')
    }

    window.operateEvents = {
      'click .like': function (e, value, row, index) {
        alert('You click like action, row: ' + JSON.stringify(row))
      },
      'click .remove': function (e, value, row, index) {
        // I want the delete action here.
      }
    }

    $(function () {
      $('#table').bootstrapTable({ data: data });
    });
  </script>
  <% } else { %>
  <div>You don't have any connected devices.</div>
  <% } %>
</div>

Проблема в том, что я не знаю, как это сделать. Я могу написать код в бэкэнде nodejs, но я не знаю, как вызвать его из EJS. Я сделал несколько попыток использовать app.local для передачи туда функции, но она выдавала ошибку из-за асинхронного вызова внутри.

Если вы считаете, что этот код плох, и я могу использовать что-то другое, дайте мне знать. Спасибо.

Ответы [ 4 ]

0 голосов
/ 06 марта 2019

Спасибо всем за помощь.Я не понял, что могу использовать метод POST без рендеринга или перенаправления на какую-то страницу.Я также обнаружил, что AJAX может довольно легко отправлять запрос POST.

Backend: 

const express = require('express');
const router = express.Router();

router.post('/remove-device', (req, res) => {
    //some code for deleting from mongo DB
    console.log('Success');
    res.send('ok');
});

module.exports = router;

Внешний интерфейс: 

<table id="table">
        <thead>
          <tr>
            <th data-field="name">Device name</th>
            <th data-field="receivingKey">Receiving key</th>
            <th data-field="operate" data-formatter="operateFormatter" data-events="operateEvents"></th>
          </tr>
        </thead>
      </table>

      <script>
        var $table = $('#table');
        var data = <%- JSON.stringify(devices) %>;

        function operateFormatter(value, row, index) {
          return [
            '<a class="like" href="javascript:void(0)" title="Like">',
            '<i class="fa fa-heart"></i>',
            '</a>  ',
            '<a class="remove" href="javascript:void(0)" title="Remove">',
            '<i class="fa fa-trash"></i>',
            '</a>'
          ].join('')
        }

        window.operateEvents = {
          'click .like': function (e, value, row, index) {
            alert('You click like action, row: ' + JSON.stringify(row))
          },
          'click .remove': function (e, value, row, index) {
            $.ajax({
              method: "POST",
              url: "/intr/remove-device",
              data: { deviceName: row.name },
            }).done(function (data) {});
          }
        }

        $(function () {
          $('#table').bootstrapTable({ data: data });
        });
0 голосов
/ 06 марта 2019

Вы можете обратиться по этой ссылке:

http://dreamerslab.com/blog/en/write-a-todo-list-with-express-and-mongodb/

Поскольку ejs используется для создания таких шаблонов, как верхний и нижний колонтитулы, навигация для всех страниц. Вы можете использовать JavaScript для генерации HTML из EJS.

0 голосов
/ 06 марта 2019

на этот вопрос ответ просто не может дать вот так ... Что я могу сделать, это направить вас к правильному способу освоения этой технологии

здесь вы увидите, чтоЭкспресс и как использовать его для настройки поддерживаемого API ..

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

Так что давай, я говорю это с уверенностью ... просто посмотри на мою репутацию ... это доказательство того, как много он узнал от него ...

ура, приятель:)

0 голосов
/ 06 марта 2019

Для пояснения, ejs не используется для выполнения запросов!

ejs используется для:

  • создание HTML-шаблонов (таких как header.ejs), которые можно использовать на любой странице
  • передать переменные с вашего сервера в html-файлы

Чтобы сделать то, что вы хотите, вам нужно будет сделать запрос из вашего файла javascript на определенный маршрут, который вы задали на странице app.js, а затем со своего сервера вы можете сделать просьба к вашей БД. Предполагая, что вы используете экспресс, выполните следующие действия. Если вы не используете экспресс, дайте мне знать, и я могу помочь вам настроить его.

Сначала вам понадобится скрипт jQuery внизу вашей страницы: 

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> 

<!-- make sure this script is above all your other scripts! -->

Далее создайте такой скрипт: 

$.ajax({url:'/somePathHere', success: function(data) {

    //code you want to execute in the clients browser after the request is made goes here

}});

Наконец, на вашей странице app.js: 

app.get('/somePathHere', function(req, res) {
    //make your call to the db here
}):
...