Füllen Sie ein HTML-Formular aus einem FormData-Objekt

Question

Ist es möglich, ein FormData-Objekt eines Formulars zu speichern und dieses FormData-Objekt später wieder zu verwenden, um die gespeicherten FormData-Werte wieder in das Formular zu aktualisieren?

Zum Beispiel: HTML

<form id="test_form"> 
    <input type="text" name="last_name" placeholder="Last Name"/><br/> 
    <input type="text" name="first_name" placeholder="First Name"/><br/> 
    <input type="date" name="date_of_birth" placeholder="Date of Birth"/><br/> 
</form> 

Javascript

var f = document.getElementById('test_form'); 
var data = FormData(f); 
... 
// mythical function to translate FormData back into form values 
f.values(data); 

Answer 1

Sie auf dem richtigen Weg ist mit dem Formdata-Objekt aus der test_form ID zu schaffen.

Sie können alle Werte aus dem Formdata-Objekt zuzugreifen, als so:

var f = document.getElementById('test_form'); 
var data = new FormData(f); 

var lastName = data.get('last_name'); 
var firstName = data.get('first_name'); 
var dob = data.get('date_of_birth'); 

Sie können auch FormData.getAll verwenden alle Daten von dem Objekt zu ziehen.

Hoffentlich ist das, was Sie gefragt haben, wenn nicht, lassen Sie es mich bitte wissen und wir können es herausfinden.

Answer 2

Sie können Werte mithilfe von FormData in Variablen speichern, jedoch nicht mithilfe von Werten. Sie müssen für jedes Feld einzeln mithilfe eines Skripts auffüllen.

Answer 3

Sie können localStorage- oder sessionStorage-Objekte verwenden.

Wie

localStorage.data = data; //untill clear the browsing history 

oder

sessionStorage.data = data; //untill session complete 

Answer 4

Nicht sicher, ob dies die Antwort auf Ihre Frage, aber wenn Sie JQuery und JQuery Ansicht Motor, können Sie diese:

var f = document.getElementById('test_form'); 
var data = FormData(f); 

// Fill the form using JQuery view Engine: 
$("#test_form").view(f); 

Siehe Beispiel: https://jocapc.github.io/jquery-view-engine/docs/form