どのように私はjavascript関数から動的入力フィールドの値を取得するのですか？

Question

私はjavascript関数を使用して動的フォームを作成しようとしていますが、私はこれを素人ですので、入力値を収集する方法がわかりません。これはHTMLの一部です：

<div> 
    Amount of people: <input type="text" id="member" name="member" value=""><br /> 
    <button id="btn" onclick="addinputFields()">Show</button> 
</div> 
<form action="{{ url_for('red_preferente') }}" method="post"> 
    <div id="mydiv"/><br /> 
    <input type="submit" value="Quote"/> 
</form> 

そして、これは、JSの機能である "addinputFields"、イムは、私が「のdocument.getElementById（ 'mydiv'）を使用しようとしている

function addinputFields(){ 
var number = document.getElementById("member").value; 

    for (i=0;i<number;i++){ 
     var campo_1 = document.createElement("output"); 
     campo_1.type = "text"; 
     campo_1.value = " Nombre: "; 
     mydiv.appendChild(campo_1); 

     var nombre = document.createElement("input"); 
     nombre.type = "text"; 
     nombre.id = "name" 
     mydiv.appendChild(nombre); 

     var campo_2 = document.createElement("output"); 
     campo_2.type = "text"; 
     campo_2.value = " Edad: "; 
     mydiv.appendChild(campo_2); 

     var edad = document.createElement("input"); 
     edad.type = "text"; 
     edad.id = "age" 
     mydiv.appendChild(edad); 

     var campo_3 = document.createElement("output"); 
     campo_3.type = "text"; 
     campo_3.value = " Modalidad: "; 
     mydiv.appendChild(campo_3); 

     var modalidades = ["Titular","Asegurado","Dependiente"]; 
     var listado = document.createElement("select"); 
     listado.id = "mySelect"; 

     for (var x = 0; x < modalidades.length; x++) { 
      var option = document.createElement("option"); 
      option.value = modalidades[x]; 
      option.text = modalidades[x]; 
      listado.appendChild(option); 
     } 
     mydiv.appendChild(listado); 
    }} 

上に呼び出して値。 "入力値を持っていますが、私は値を受け取りません

私はvars：nombre、edad、listadoの入力値のそれぞれを必要とします。何か案が？

ありがとうございました！

Answer 1

問題の原因はさまざまです。入力が文字列であるので、あなたは問題がcreateElement()文の周りにあるように思わ

var number = parseInt(document.getElementById("member").value); 

使用して、あなたの入力をキャストする必要があります。あなたの<variable name>.valueは正しくありません。それは<input>または<textarea>の値でのみ機能します。簡単なのは、createElement()を取り除くことでした。

var campo_1 = document.createElement("output"); 
campo_1.type = "text"; 
campo_1.value = " Nombre: "; 
mydiv.appendChild(campo_1); 

線が容易に書き換えることができた

mydiv.innerHTML += "Nombre: ";