So übermitteln Sie mehrere Daten auf einmal mit einem Formular

Question

Die Frage ist ungeschickt formuliert, also ertragen Sie mit mir, wie ich es erkläre.

Ich verwende Node.js, Express und MongoDB.

Hier ist mein Back-End-Code für ein Anmeldeformular:

router.post('/inputlog', function(req, res) { 
Log.findOne({logTitle: req.body.logTitle}, function(err, existingLog) { 
    if(!existingLog) { 
     req.flash('errors', req.body.logTitle + ' was not found'); 
     return res.redirect('/inputlog'); 
    } 
    if(existingLog) { 
     Lot.findOneAndUpdate({logTitle: req.body.logTitle}, { 
      $push: { 
       OutdoorLogs: { 
        LogInput: { 
         logDate: req.body.logDate, 
         logInput: req.body.logInput 
        } 
       } 
      } 
     }, {safe: true, upsert: false}, function (err, logSuccess) { 
      if(err) { 
       req.flash('errors', 'Log was not inserted due to Error.'); 
       return res.redirect('/inputlog'); 
      } 
      if(logSuccess) { 
       req.flash('success', req.body.logTitle+ ' Log has been updated. '); 
       return res.redirect('/inputLog'); 
      } 
     }); 
    } 
}) 
}); 

Also, was ist das alles sagen? Grundsätzlich habe ich ein Formular zum Eingeben von Protokollen. Sie fügen zuerst einen Titel für ein Protokoll hinzu. Es wird dann in der Datenbank (MongoDB) nach dem Titel des von Ihnen eingegebenen Protokolls suchen. Wenn kein solcher Protokolltitel existiert, sendet er dem Benutzer einen Fehler.

Wenn der Protokolltitel vorhanden ist, fügt er ein 'logDate' und 'logInput' in ein Array in diesem Protokolltitel ein.

Das ist alles gut und gut. ABER! Was ist, wenn ich mehrere Protokolle (mehrere logDates und logInputs) unter der selben Zeit eingeben wollte? So wie ich das Formular eingerichtet, I-Eingang kann nur ein neues Geschäft in einer Zeit, in diesen Array einzuloggen, und hier ist meine Form als Referenz:

<form method="POST" action="/inputlog"> 
    <div class='form-group'> 
     <label for="logTitle">Log Title</label> 
     <input type="text" name="logTitle" autofocus class="form-control uppercase" id="logTitle"/> 
    </div> 
    <div class='form-group'> 
     <label for="logDate">Log Date</label> 
     <input type="text" name="logDate" class="form-control logDate" id="logDate"/> 
    </div> 
    <div class='form-group'> 
     <label for="logInput">log Input</label> 
     <input type="text" name="logInput" class="form-control logInput" id="logInput"/> 
    </div> 
    <div class='form-group'> 
     <input type="submit" class="btn btn-default btn-primary pull-right" value="submit"> 
    </form> 

Also noch einmal die Art und Weise dieser Form eingerichtet ist Ich kann nur einen log gleichzeitig eingeben. Wenn ich 20 verschiedene Logs gleichzeitig eingeben möchte, muss ich alles nacheinander tun (Log eingeben, Submit drücken, Log eingeben, Submit drücken, etc ...).

Wie kann ich mehrere Protokolle (Einträge) mit nur einem Senden eingeben?

Answer 1

Warum refactorieren Sie das Formular nicht, sodass nach Abschluss eines Eintrags ein zusätzlicher Satz von Eingaben angezeigt wird. Ich würde onblur für jede Eingabe verwenden, die das Formular überprüfen würde, um sicherzustellen, dass jede Eingabe über Text verfügt, wenn es eine Funktion ausführt, um ein zusätzliches Formular hinzuzufügen. Haben Sie eine ID für jede Formulargruppe, die einem Array-Index entsprechen könnte, und schieben Sie ein Objekt mit den Feldern in. Wenn sie später bearbeitet werden, können sie vor dem Senden geändert werden.