Изменен рабочий модал / FORM на MULTIPART / FORM для загрузки файла Mongoose / Multer - модал остается открытым - PullRequest
Новая
       13

Изменен рабочий модал / FORM на MULTIPART / FORM для загрузки файла Mongoose / Multer - модал остается открытым

0 голосов
/ 24 октября 2018

у меня был рабочий модал / форма (сокращенно):

html: 

<div id="addNew" class="modal">
<form class="modal-content animate">
    <div class="container">
    <table id="t01">
      <tbody>
        <tr>
          <td>Date</td>
          <td>Time</td>
        </tr>
        <tr>
          <td>
          <input id="id_date" type="date" name="date" required>
          </td>
          <td>
          <input id="id_time" type="time" name="time" required>
          </td>
        </tr>
      </tbody>
    </table>
      <br>
      <button type="submit" class="buttons" onclick="submit_new()">Safe</button>
      <button type="button" onclick="document.getElementById('addNew').style.display='none'" class="cancelbtn">Cancel</button>
    </div>
  </form>
</div>

Вызывал функцию, которая сбрасывает материал в mongodb:

function: 

function submit_new() {
    $.ajax({
        type: "POST",
        url: '/submit_new',
        data: {
            date:$('#id_date').val(),
            time:$('#id_time').val(),
            },
        });
    };

приложение: 

app.post('/submit_new', function (req, res) {
          const postBody = req.body;
          Faenge.create({date: postBody.date, time: postBody.time }), function (err, res) {
            if (err)  {
                throw err;
            }
                console.log("1 document inserted");
                Faenge.close()
            }
    });

Это работает без проблем.После нажатия кнопки отправки, модал приближается, и значения сбрасываются в коллекцию.

Мне нужно было добавить загрузку изображений с помощью multer.Загрузка, записи MongoDB и т. Д. Работает, когда я нажимаю кнопку «Отправить», нет проблем, но модал остается открытым навсегда.Даже если я закрываю модал с помощью команды cancel, он закрывается, но если я снова открываю его, значения все еще там.

html: 

<div id="addNew" class="modal">
<form class="modal-content animate" id="test-data" method="post" enctype="multipart/form-data">
<div class="container">
<table id="t01">
<tbody>
<tr>
<td>Date</td>
<td>Time</td>
</tr>
<tr>
<td>
<input id="id_date" type="date" name="date" required>
</td>
<td>
<input id="id_time" type="time" name="time" required>
</td>
</tr>
</tbody>
</table>
</tr>
<br>
<tr>
<input id="id_picture" type="file" name="Bild" accept="image/*" multiple="multiple" />  
</form>
<br>
<br>
<button type="submit" class="buttons">Speichern</button>
<button type="button" onclick="document.getElementById('addNew').style.display='none'" class="cancelbtn">Abbrechen</button>
</div>
</form>

function: 

$(document).ready(function() {
$("form#test-data").submit(function(e) {
        e.preventDefault();    
        var formData = new FormData(this);
        $.ajax({
            url: '/submit_new',
            type: 'POST',
            data: formData,
            success: function (data) {
                alert(data);
            },
            cache: false,
            contentType: false,
            processData: false
        });
    });
return false;
});

app: 

app.post('/submit_new', upload.single('Bild') , function (req, res, next) {
            if(req.file){
                filepath = req.file.path;
            } else {
                filepath = "";
            }
          const postBody = req.body;
          Faenge.create({
              date: postBody.date, 
              time: postBody.time, 
              filepath: filepath,
              }), function (err, res) {
              if (err)  {
                throw err;
              }else{
                console.log("1 document inserted");
                Faenge.close()
            }}          
    });

Могу ли я попросить кого-нибудь о помощи, пожалуйста.Заранее спасибо,

С уважением

1 Ответ

0 голосов
/ 24 октября 2018

Я нашел его сам и добавил: 

onclick="document.getElementById('addNew').style.display='none'"

к кнопке отправки ....

...