Экспресс/Мангуст обновляет документ при нажатии на него

#node.js #mongodb #express #mongoose

Вопрос:

Я загружаю свои данные из mongodb atlas, и каждый документ получает кнопку удаления и редактирования.

Кнопка «Удалить» уже работает!

Я использую панели управления для отображения содержимого:

 <section class="get">
    <h3>CONTENT</h3>
    <div>
        {{# each items }}
            <article class="item">
                <div>ID: {{ this._id }}</div>
                <div>Name: {{ this.name }}</div>
                <div>Description: {{ this.description }}</div>
                <div>Price: {{ this.price }}</div>
                <img src="data:image/png;base64, {{this.image}}" alt="{{ this.name }}">
                <button class="edit-button">EDIT</button>
                <button class="delete-button" onclick="openDeleteForm.call(this)">DELETE</button>
            </article>
        {{/each}}
        <button class="open-button" onclick="openForm()">ADD</button>
    </div>
</section>
 

Теперь мой вопрос в том, как я могу редактировать — я хочу открыть всплывающее окно, в котором у меня есть поле ввода для каждого поля со значением элемента, на который был нажат. Должен ли я получать значения из HTML или каким-то образом с помощью руля {{ this.value }} ?
Или, может быть, есть лучшее решение, чем одно из тех, о которых я упоминал.

Это мое «Добавить всплывающее окно», и я хочу, чтобы «Редактировать всплывающее окно» было таким же, но с предварительно заполненными значениями.

Добавить всплывающее окно


Изменить: API: метод вставки:

 router.post("/insert", upload.single("image"), (req, res) => {


    const buffer = new Buffer(fs.readFileSync(req.file.path)).toString("base64");

    var item = {
        name: req.body.name,
        description: req.body.description,
        price: req.body.price,
        image: buffer
    };


    var data = new MenuData(item);


    data.save((err) => {
        res.redirect('/admin');
    });


});
 

Удалить:

 router.post('/delete', function (req, res, next) {
    let id = req.body.deleteId;

    MenuData.findByIdAndRemove(id).exec((err) => {
        res.redirect('/admin');
    });
});
 

Другой вопрос: Как я могу сократить время загрузки изображений (как вы можете видеть, я храню изображения как base64 в mongodb atlas). Просто измените их размер (делает ли изменение размера base64 короче)?

Комментарии:

1. Какая часть взаимодействует с mongodb ? вы использовали api или просто использовали рендеринг сервера

2. Я думаю, что api (index.js файл, в котором get и post обрабатываются с помощью node/express)

3. Поэтому, пожалуйста, добавьте больше кода, связанного с api

4. @HellCatVN отредактировано