Ich habe eine Json-Datei mit zwei Typ 128 und 140. und ich möchte ein Formular mit ihnen über Javascript produzieren. Ich möchte inputbox erzeugen, wenn der Typ war 128 außerdem selectbox erzeugen, wenn der Typ 137 war, und wollen es generieren dynamically.i 128 die Form, die ich zu generieren erwarten ein div Im Austausch für Typ wiederholen möchte, ist ungefähr wie folgt aus:Wie ein Formular mit einem Json erstellen
<form method="post" action="/roundtrip_final.bc" id="finalinvoice">
<div class="passenger_box"><div class="tblreserve adultInfoes">
<div class="c-infoo">
<label for="name" class="abs-tlt"> name</label>
<input placeholder="firstname " id="name" name="_root.passengerinfo__1.passengerinfo.fullname.firstname" class="nofilling2 engword" type="text">
</div>
<div class="c-infoo">
<label for="family" class="abs-tlt">lastname</label>
<input placeholder=" lastname" id="family" name="_root.passengerinfo__1.passengerinfo.fullname.lastname" class="nofilling2 engword" type="text">
</div>
<div class="c-infoo">
<label class="abs-tlt" for="gender"></label>
<select name="_root.passengerinfo__1.passengerinfo.gender">
<option value="1" selected="">male</option>
<option value="0">famale</option>
</select>
</div>
<div class="clr"></div></div><div class="clr"></div></div>
</form>
Hier ist mein Javascript-Code: (140)
var schema = [{
"queestion":"name" ,
"type":"128",
"attrs":[
{"attr":{
"name":"class",
"value":"nofilling2 engword"
}},
{"attr":{
"name":"id",
"value":"name"
}},
{"attr":{
"name":"type",
"value":"text"
}},
{"attr":{
"name":"placeholder",
"value":"name"
}},
{"attr":{
"name":"name",
"value":"_root.passengerinfo__1.passengerinfo.fullname.firstname"
}}
]
},
{
"queestion":"lastname" ,
"type":"128",
"attrs":[
{"attr":{
"name":"class",
"value":"nofilling2 engword"
}},
{"attr":{
"name":"id",
"value":"family"
}},
{"attr":{
"name":"type",
"value":"text"
}},
{"attr":{
"name":"placeholder",
"value":"lastname"
}},
{"attr":{
"name":"name",
"value":"_root.passengerinfo__1.passengerinfo.fullname.lastname"
}}
]
},
{
"queestion":"birthdate" ,
"type":"128",
"attrs":[
{"attr":{
"name":"class",
"value":"datepicker finalforminut nofilling2 pwt-datepicker-input-element"
}},
{"attr":{
"name":"id",
"value":""
}},
{"attr":{
"name":"placeholder",
"value":"birthdate"
}},
{"attr":{
"name":"type",
"value":"text"
}},
{"attr":{
"name":"name",
"value":"_root.passengerinfo__1.passengerinfo.birthdate"
}}
]
}]
for (var i = 0; i < schema.length; i++) {
var type=schema[i].type;
if(type==128){
for (var y=0;y<schema[i].type.length;y++){
var string = "<div class="c-infoo"><label for="family" class="abs-tlt"> ";
string += schema[i].queestion;
string+="</label>";
var y=document.getElementsByClassName('adultInfoes');
y.innerHTML=string + " : ";
var string1 = "<_input ";
for (var x=0;x<schema[i].attrs.length;x++){
string1 += schema[i].attrs[x].attr.name+'="'+schema[i].attrs[x].attr.value+'" '
}
string1+=">";
console.log(string)
var y=document.getElementsByClassName('adultInfoes');
y.innerHTML=string1;
}
}
}