mdb.js

<script>
var input = document.getElementById("plz_input");
input.addEventListener("keyup", function (event) {
    // Number 13 is the "Enter" key on the keyboard
    if (event.keyCode === 13) {
        // Cancel the default action, if needed
        event.preventDefault();
        // Trigger the button element with a click
        document.getElementById("startrequest").click();
    }
});
function request_information_ui() {
    console.log("Request startet");
    var plz = jQuery("#plz_input").val();
    var endpoint = "https://www.umweltinstitut.org/index.php?eID=wahlkreis_search&action=mdb_by_plz_office&plz=" + plz;
    var testpoint = "https://fridaysforfuture.de/dev/example.json";
    jQuery.ajax({
        type: "get",
        url: endpoint,
        success: function (data, text) {
            document.getElementById("secondaryinteractionlevel").innerHTML = "";
            document.getElementById("waiting").style.display = (data === undefined || data.length == 0) ? "block" : "none";
            for (var wahlkreis in data) { // Für einzelne Wahlkreise
                document.getElementById("secondaryinteractionlevel").insertAdjacentHTML('beforeend', display_wahlkreis(wahlkreis, data[wahlkreis]["WAHLKREISBEZEICHNUNG"]));
                for (var mdb in data[wahlkreis]["mdbs"]) { // Für jede/n Ansprechpartner*in im Wahlkreis
                    document.getElementById("secondaryinteractionlevel").insertAdjacentHTML('beforeend', display_mdb(data[wahlkreis]["mdbs"][mdb]));
                }
            }
        },
        error: function (request, status, error) {
            alert(request.responseText, error);
        }
    });
}
function display_wahlkreis(id, bezeichnung) {
    return '<h3>' + bezeichnung + ' (Wahlkreis ' + id + ')</h3><hr />';
}
function display_mdb(mdb) {
    return '<h4>' + display_anrede(mdb) + '</h4>' +
        '<h5>' + display_twitter_link(mdb["TWITTERNAME"]) + display_partei(mdb["PARTEI"]) + '</h5>' +
        display_addresses(mdb["KONTAKT"]);
}
function display_addresses(addresses) {
    var html = '';
    for (var i in addresses) {
        adresse = addresses[i];
        html +=
            '<table class="contact-options"><tr>' +
            '<th>Telefon</th>' +
            '<td><a href="tel:' + adresse["TELEFON"] + '">' + adresse["TELEFON"] + '</a></td>' +
            '</tr><tr>' +
            '<th>E-Mail</th>' +
            '<td><a href="mailto:' + adresse["EMAIL"] + '">' + adresse["EMAIL"] + '</a></td>' +
            '</tr><tr>' +
            '<th>Adresse</th>' +
            '<td><strong>' + adresse["TYP"] + '</strong><br />' + adresse["STRASSE"] + '<br />' + adresse["PLZ"] + ' ' + adresse["ORT"] + ' <br /><a href="' + get_googlemaps_link(adresse) + '" target="_blank" rel="noopener noreferrer">Karte öffnen</a></td>' +
            '</tr></table>';
    }
    return html;
}
function display_anrede(mdb) {
    return (mdb["TITLE"] ? mdb["TITLE"] + ' ' : '') + mdb["VORNAME"] + ' ' + mdb["NACHNAME"];
}
function display_twitter_link(handle) {
    return handle ? '<a class="twitter-link" href="https://twitter.com/' + handle + '" target="_blank" rel="noopener noreferrer">@' + handle + '</a>, ' : '';
}
function display_partei(partei) {
    return partei || "Parteilos";
}
function get_googlemaps_link(adresse) {
    return 'https://www.google.de/maps/place/' + adresse["STRASSE"].replace(' ', '+') + ',+' + adresse["PLZ"] + '+' + adresse["ORT"];
}
function validate(evt) {
    var theEvent = evt || window.event;
    // Handle paste
    if (theEvent.type === 'paste') {
        key = event.clipboardData.getData('text/plain');
    } else {
        // Handle key press
        var key = theEvent.keyCode || theEvent.which;
        key = String.fromCharCode(key);
    }
    var regex = /[0-9]/;
    if (!regex.test(key)) {
        theEvent.returnValue = false;
        if (theEvent.preventDefault) theEvent.preventDefault();
    }
}
</script>