Senden Formular nicht mit mehreren Feldern verbunden

Question

Ich habe ein Formular auf einer Webseite, die ich möchte ein Benutzer ausfüllen können, drücken Sie Senden, und es zeigt etwas wie "Benutzer: [Name] hat ein Ereignis [Ereignis] um [Ort] mit Details [Beschreibung] "in einem Kommentarabschnitt unten. So werden mehrere Einträge einfach untereinander geladen. Gerade jetzt, wenn ich auf "submit" klicke, wird nur der Beschreibungstext und nichts anderes gesendet. Meine Funktion getInfo() sollte mehrere Werte anzeigen, ist es aber nicht. Wie kann ich das beheben? Vollständiger Code verknüpft unter

https://github.com/tayrembos/Nav/blob/master/back.html

   <script type="text/javascript"> 
       function getInfo() { 
        text = name.value; 
        text = words.value; 
        document.getElementById("para").innerHTML += '<p>'+ text 
        document.getElementById("words").value = "Enter comment" 
        document.getElementById('name').value = "Enter name" 
       } 
       </script> 

       <form method="POST" name='myform'> 
       <p>Enter your name: 
        <textarea id='name' rows="1" cols="20">Enter name</textarea> 

       <textarea id='name' rows="1" cols="20">Enter name</textarea> 

       <textarea id='words' rows="10" cols="20">Enter comment</textarea> 
       <input type="button" onclick="getInfo()" value="Submit!" /> <br> 
       <p id="para"></p> 

Answer 1

i verwenden Anfügen von jquery (Abstimmung, ob es wirklich Ihr Problem löst).

function myFunction() { 
 

 
    var x = document.getElementById("product"); 
 
    var txt = ""; 
 
    var all = {}; 
 
    var i; 
 

 
    for (i = 0; i<x.length-1; i++) { 
 

 
      //txt = txt + x.elements[i].value + "<br>"; 
 
      all[x.elements[i].name]= x.elements[i].value; 
 

 
    } 
 

 
$("p").append(JSON.stringify(all, null, 2)); 
 

 
    //var myObj = { "name":"John", "age":31, "city":"New York" }; 
 

 
    //document.getElementById("demothree").innerHTML = myObj; 
 

 
    //var myJSON = JSON.stringify(all); 
 
    //window.location = "server.php?x=" + myJSON; 
 

 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> 
 
<form id="product"> 
 
    
 
    Expire: <input type="text" name="pexpire" value="3:45"><br> 
 
    Old Price: <input type="text" name="poldprice" value="30"><br> 
 
    Price: <input type="text" name="pprice" value="28"><br> 
 
    Category: <input type="text" name="pcategory" value="Ενδύματα"><br> 
 
    Variaty: <input type="text" name="pvariaty" value="Τζιν"><br> 
 
    City: <input type="text" name="pcity" value="Δράμα"><br> 
 
    Store: <input type="text" name="pstore" value="Groove"><br> 
 
    Picture: <input type="text" name="ppicture" value="aaa"><br> 
 

 
    
 

 
</form> 
 

 
<button onclick="myFunction()">Submit</button> 
 

 
<p id="list"></p>