Hallo zusammen,
ich habe ein Formular gebastelt, bei dem eine PLZ eingegeben wird und der dazugehörige Wohnort automatisch eingetragen wird.
Falls ein zweiter Wohnsitz besteht, kann das Formular durch Buttonklick nochmals erzeugt werden.
Das Problem ist, dass beim ersten Formular die Erkennung der PLZ funktioniert und die passende Stadt dazu eingetragen wird.
Für das 2. und die ff. Formulare passiert allerdings rein gar nichts.
Kann das damit zusammenhängen, dass das 2. und ff. Formular beim Laden der Seite noch gar nicht vorhanden war? Falls das das Problem ist, wie umschiffe ich das?
Grüße,
Michael
Code
<div class="wohnsitzinputelements">
<span>Bitte geben Sie Ihren Wohnort an</span><br>
<input type="number" name="plz-0" id="plz" required placeholder="Postleitzahl"><br>
</div>
<div class="wohnsitzinputelements">
<span></span><br>
<input type="text" id="wohnort" name="wohnort-0" required placeholder="Wohnort"><br>
</div>
<div class="neuerwohnsitz">
<button id="addwohnsitz" type="button" onclick="addWohnsitz(this)" data-wsi-add="0">Reiseprofil hinzufügen</button>
<input type="hidden" name="anz_zus_ws" value="0">
<button id="removewohnsitz" type="button" onclick="removeWohnsitz(this)" style="display: none" data-wsi-remove="0">Eintrag löschen</button>
</div>Code
$('#plz').bind('keyup change', function(e) {
if ($(this).val().length > 4) {
var ort = $('#wohnort');
$.getJSON('http://www.geonames.org/postalCodeLookupJSON?&country=DE&callback=?', {postalcode: this.value }, function(response) {
if (response && response.postalcodes.length && response.postalcodes[0].placeName) {
ort.val(response.postalcodes[0].placeName);
}
})
} else {
$('#wohnort').val('');
}
});Code
function addWohnsitz(button_number) {
var nbr = button_number.getAttribute("data-wsi-add");
nbr = Number(nbr);
var elmnt = document.getElementsByClassName("wohnsitzinput")[nbr];
var cln = elmnt.cloneNode(true);
nbr = nbr + 1;
var btn_parent = cln.getElementsByTagName("div")[29];
var inpt = btn_parent.getElementsByTagName("input")[0];
var btn_add = btn_parent.getElementsByTagName("button")[0];
var btn_rem = btn_parent.getElementsByTagName("button")[1];
btn_add.setAttribute("data-wsi-add",nbr);
btn_rem.setAttribute("data-wsi-remove",nbr);
inpt.setAttribute("value", nbr);
var date_input_parent = cln.getElementsByTagName("div")[0];
var date_input = date_input_parent.getElementsByTagName("input")[0];
date_input_parent.removeChild(date_input);
var date_input = document.createElement("input");
date_input.type = "text";
date_input.name = "wohnsitz_ab-" + nbr;
date_input.setAttribute("required", "");
$(date_input).datepicker();
date_input_parent.appendChild(date_input);
var plz = cln.getElementsByTagName("div")[2];
var plz_inpt = plz.getElementsByTagName("input")[0];
plz_inpt.setAttribute("name", "plz-" + nbr);
plz_inpt.value = "";
var wohnort = cln.getElementsByTagName("div")[3];
var wohnort_inpt = wohnort.getElementsByTagName("input")[0];
wohnort_inpt.setAttribute("name", "wohnort-" + nbr);
wohnort_inpt.value = "";
var flgz_zmdnst = cln.getElementsByTagName("div")[5];
var fl_zmd_ja = flgz_zmdnst.getElementsByTagName("input")[0];
var fl_zmd_nein = flgz_zmdnst.getElementsByTagName("input")[1];
fl_zmd_ja.setAttribute("name", "flugzumdienst-" + nbr);
fl_zmd_nein.setAttribute("name", "flugzumdienst-" + nbr);
fl_zmd_ja.setAttribute("data-anr-flgz", nbr);
fl_zmd_nein.setAttribute("data-anr-auto", nbr);
fl_zmd_nein.checked = true;
var flgz_zmdnst_entf = cln.getElementsByTagName("div")[6];
var flgz_zmdnst_text = flgz_zmdnst_entf.getElementsByTagName("span")[0];
flgz_zmdnst_text.innerHTML = "Entfernung Wohnsitz - Homebase";
var ent_ws_hb = cln.getElementsByTagName("div")[6];
var ent_inpt = ent_ws_hb.getElementsByTagName("input")[0];
ent_inpt.value = "";
ent_inpt.setAttribute("name", "entfernung_ws_hb-" + nbr);
var dauer_ws_hb = cln.getElementsByTagName("div")[9];
var dauer_inpt = dauer_ws_hb.getElementsByTagName("input")[0];
dauer_inpt.value = "";
dauer_inpt.setAttribute("name", "reisezeit_ws_hb-" + nbr);
var stb_hb = cln.getElementsByTagName("div")[11];
var stb_hb_ja = stb_hb.getElementsByTagName("input")[0];
var stb_hb_nein = stb_hb.getElementsByTagName("input")[1];
stb_hb_ja.setAttribute("name", "standbyhomebase-" + nbr);
stb_hb_nein.setAttribute("name", "standbyhomebase-" + nbr);
stb_hb_nein.checked = true;
var anr_vt = cln.getElementsByTagName("div")[13];
var anr_vt_ja = anr_vt.getElementsByTagName("input")[0];
var anr_vt_nein = anr_vt.getElementsByTagName("input")[1];
anr_vt_ja.setAttribute("name", "anreisevortag-" + nbr);
anr_vt_nein.setAttribute("name", "anreisevortag-" + nbr);
anr_vt_ja.setAttribute("data-ea-ci-on", nbr);
anr_vt_nein.setAttribute("data-ea-ci-off", nbr);
anr_vt_nein.checked = true
var anr_vt_uz = cln.getElementsByTagName("div")[14];
var uz_inpt = anr_vt_uz.getElementsByTagName("input")[0];
uz_inpt.setAttribute("name", "earlycheckin-" + nbr);
anr_vt_uz.style.display = "none";
var abr_ft = cln.getElementsByTagName("div")[16];
var abr_ft_ja = abr_ft.getElementsByTagName("input")[0];
var abr_ft_nein = abr_ft.getElementsByTagName("input")[1];
abr_ft_ja.setAttribute("name", "abreisefolgetag-" + nbr);
abr_ft_nein.setAttribute("name", "abreisefolgetag-" + nbr);
abr_ft_ja.setAttribute("data-lt-co-on", nbr);
abr_ft_nein.setAttribute("data-lt-co-off", nbr);
abr_ft_nein.checked = true;
var abr_ft_uz = cln.getElementsByTagName("div")[17];
var uz_inpt2 = abr_ft_uz.getElementsByTagName("input")[0];
uz_inpt2.setAttribute("name", "latecheckout-" + nbr);
abr_ft_uz.style.display = "none";
var stbb = cln.getElementsByTagName("div")[19];
var stbb_ja = stbb.getElementsByTagName("input")[0];
var stbb_nein = stbb.getElementsByTagName("input")[1];
stbb_ja.setAttribute("name", "standbybude-" + nbr);
stbb_nein.setAttribute("name", "standbybude-" + nbr);
stbb_ja.setAttribute("data-stb-bd-on", nbr);
stbb_nein.setAttribute("data-stb-bd-off", nbr);
stbb_nein.checked = true;
var ang_stb = cln.getElementsByTagName("div")[20];
ang_stb.style.display = "none";
var mtb = cln.getElementsByTagName("div")[21];
var mtb_uz_inpt = mtb.getElementsByTagName("input")[0];
mtb_uz_inpt.setAttribute("name", "min_time_between-" + nbr);
var stbb_oder_hotel = cln.getElementsByTagName("div")[23];
var hotel = stbb_oder_hotel.getElementsByTagName("input")[0];
var stb_bude = stbb_oder_hotel.getElementsByTagName("input")[1];
hotel.setAttribute("name", "unterkunft-" + nbr);
stb_bude.setAttribute("name", "unterkunft-" + nbr);
stb_bude.checked = true;
var ent_ws_stb = cln.getElementsByTagName("div")[24];
var ent_ws_stb_inpt = ent_ws_stb.getElementsByTagName("input")[0];
ent_ws_stb_inpt.setAttribute("name", "entfernung_ws_stb-" + nbr);
var ent_stb_hb = cln.getElementsByTagName("div")[27];
var ent_stb_hb_inpt = ent_stb_hb.getElementsByTagName("input")[0];
ent_stb_hb_inpt.setAttribute("name", "entfernung_stb_hb-" + nbr);
var zuf = document.getElementsByClassName("wohnsitzinhalt")[0];
zuf.appendChild(cln);
var btn_parent = elmnt.getElementsByTagName("DIV")[29];
var btn_alt = btn_parent.getElementsByTagName("button")[0];
if(nbr == 1){
btn_alt.style.display = "none";
btn_rem.style.display = "block";
}
if(nbr > 1){
var elmnt = document.getElementsByClassName("wohnsitzinput")[nbr-1];
var add_parent = elmnt.getElementsByTagName("div")[29];
var add_button = add_parent.getElementsByTagName("button")[0];
add_button.style.display = "none";
}
}