Wert aus einer Datenbank ausgeben

CreativPur

Erfahrenes Mitglied
Hi, i
ich komme einfach nicht weiter.
Ich habe einen Kalender, mit einer Zeitausgabe von - bis.

Javascript:


Javascript:
time2 = data[I].timestamp.replace(/-|:/g, " ").split(" ").slice(3, 6);
time2 = new Date(2000, 01, 01, time2[0], time2[1], time2[2]);

time2 = {
hours: time2.getHours(),
minutes: time2.getMinutes() < 10 ? "0" + time2.getMinutes() : time2.getMinutes(),
ampm: (time2.getHours() < 12 ? "am" : "pm")
}

if (time_format == "standard") {
time2.hours = (time2.hours > 12) ? time2.hours - 12 : time2.hours;
time2 = time2.hours + ":" + time2.minutes + time2.ampm;
}
else if (time_format == "military") {
                  
time2.hours = time2.hours + 2;
time2 = time2.hours + ":" + time2.minutes + " " + "Uhr";
}[/I]
bei einem festen Wert von +2 "time2.hours = time2.hours + 2;" werden auch tatsächlich 2 Stunden zugezählt.
also 13:00 - 15:00 Uhr

Jetzt habe ich aber in der Datenbank eine Spalte Namens "beratungszeit".

diesen Wert möchte ich folgend anstatt der festen Zahl (+ 2) übergeben..
data.beratungszeit

also :
Javascript:
Javascript:
bz = data[I].beratungszeit;

time2.hours = time2.hours + bz;
time2 = time2.hours + ":" + time2.minutes + " " + "Uhr";
Leider funktioniert dies nicht.
In der Datenbank ist auch der Wert 2,
aber in diesem Fall wird folgendes ausgegeben.

Bildschirmfoto 2021-05-02 um 13.30.47.png



der Wert 2 wird einfach nur hinten dran gehängt.

Wie kann ich den Code ändern ?
 
versuche es mal mit parseInt
Code:
time2.hours = parseInt(time2.hours) + 2;

oder

time2.hours = parseInt(time2.hours) + parseInt(bz);
 
Hallo,
jetzt bin ich schon wieder auf ein Problem gestoßen.

Für meinen Kalender habe ich 2 Tabellen
1. events
Bildschirmfoto 2021-05-04 um 10.20.44.png
dort findet sich die Spalte location

die 2. Tabelle heißt filialen
Bildschirmfoto 2021-05-04 um 10.23.36.png
auch hier findet sich die Spalte location
in diesem Beispiel müsste 2x Witzenhausen ausgegeben werden

In meinem Kalender werden die Termine per click über ein Modal angezeigt
Bildschirmfoto 2021-05-04 um 10.24.52.png

Bildschirmfoto 2021-05-04 um 10.34.38.png
Die Daten werden aus der Tabelle events ausgegeben.

Logischerweise wird mir jetzt eine 1 anstatt Witzenhausen angezeigt.

Jetzt zu meinen meinen Unkenntnissen!
ich bekomme es nicht hin, das script so umzusetzen, dass beide Tabellen verknüpft werden und das richtige Resultat erzeugen.

Hier meine Quelltexte:
Calendar.php
PHP:
<div class="container" style="padding-top:20px">       
    <table class="table table-bordered">
        <thead>
        <tr>
        <th><span id="anio"></span></th>
        <th colspan="5" style="padding: 0px; line-height: 38px;">
        <a class="prev" onclick="Go('prev')" href="javascript:void(0)"></a>
        <span id="mes"></span>
        <a class="next" onclick="Go('next')" href="javascript:void(0)"></a>
        </th>
        <th style="padding: 0px; line-height: 40px;">
        <a class="today" onclick="Go('today')" href="javascript:void(0)">Heute</a>
        </th>
        </tr>
        <tr class="weekdays info" id="Monday">
        <!-- WEEKDAYS -->
        </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>
        
<div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h3 id="myModalLabel">Kunden-Termine</h3>
            </div>
            <div class="modal-body">

            </div>
            <div class="modal-footer">
            </div>
        </div>
    </div>
</div>

date.php
PHP:
<?php
    require_once '../admin/settings.php';
    require_once '../config/db_config.php';

    $select = trim($_POST['select']);
    $where = trim($_POST['where']);
    $d = trim($_POST['d']);
    $order = trim(stripslashes($_POST['order']));
    $limit = isSet($_POST['limit']) ? " LIMIT ".trim($_POST['limit']) : '';

    $sql = "SELECT *, DATE_FORMAT(timestamp, '".$select."') selector FROM events WHERE DATE_FORMAT(timestamp, '".$where."') = '".$d."'   AND aktiv=1   ORDER BY ".$order." ASC".$limit;
    $query = mysqli_query($link, $sql);
    if (mysqli_num_rows($query) > 0) {
        $data = array();
        while ($recset = mysqli_fetch_array($query)) {
            if (!array_key_exists($recset["selector"], $data)) {
                $data[$recset["selector"]] = array($recset);
            }
            else {
                array_push($data[$recset["selector"]],$recset);
            }
        }
        echo json_encode($data);
    }
?>

script.js
Javascript:
if (!Object.keys) {
    Object.keys = (function () {
        var hasOwnProperty = Object.prototype.hasOwnProperty,
            hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'),
            dontEnums = ['toString', 'toLocaleString', 'valueOf', 'hasOwnProperty', 'isPrototypeOf', 'propertyIsEnumerable', 'constructor'],
            dontEnumsLength = dontEnums.length;

    return function (obj) {
        if (typeof obj !== 'object' && typeof obj !== 'function' || obj === null) throw new TypeError('Object.keys called on non-object');

        var result = [];

        for (var prop in obj) { if (hasOwnProperty.call(obj, prop)) result.push(prop); }

        if (hasDontEnumBug) {
            for (var i=0; i < dontEnumsLength; i++) {
            if (hasOwnProperty.call(obj, dontEnums[i])) result.push(dontEnums[i]);
            }
        }
        return result;
    };
  })();
}

var m_text = ["", "Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"];
var weekdays = ["Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag", "Sonntag"];
var tbody;
var this_td;
var time_format;
var d = new Date();
var day = d.getDate();
var month = d.getMonth() + 1;
var year = d.getFullYear();
var days_number = daysInMonth(month, year);
var actual_d = d.getDate();
var actual_m = d.getMonth() + 1;
var actual_y = d.getFullYear();
var page = 1, showEvents = [];
var storage;
var weekdaysChanged = false;

$(function() {
    tbody = $("tbody");
    time_format = $("#timeFormat").val();

    tbody.val(getCalendar(year, month));

    wdaysOriginal();

    $(".active").on("click", function () {
        $(this).removeClass("active");
        $(this).hide();
    });

    $("table").delegate("td", "click", function () {
        $("td").removeClass("active");
        $("#myModalLabel").text("Kunden-Termine");
        


        if (!$(this).hasClass("blank")) {
            $(this).addClass("active");


            this_td = $(this);

            $(".modal-body").empty();
            $(".modal-footer").empty().removeClass("Kunden-Termin hinzufügen");

            $('#myModal').modal("show");

            if (typeof($(this).children(".label").html()) !== "undefined") {
                page = 1;
                showEvents = [];

                if (parseInt(this_td.children(".label").html()) > 4) {
                    showEvents = [0, 1, 2, 3,4];
                }
                else {
                    for (i = 0; i < parseInt(this_td.children(".label").html()); i++) {
                        showEvents.push(i);
                    }
                }
                getFirstEvents(this_td);
            }
            else {
                getFirstEvents(null);
            }
        }
    });

    $("#myModal").on("hidden.bs.modal", function () {
        $("td").removeClass("active");
    });

    var width = $(window).width();
    if (width < 960) {
        $("tr.weekdays").empty();
        for (i = 0; i < 7; i++) {
            weekdays[i] = weekdays[i].substring(0, 3);
            $("tr.weekdays").append("<th>" + weekdays[i] + "</th>");
        }
    }
});

function getFirstEvents() {
        $.ajax({
            dataType: "json",
            url: "calendar/php/date.php",
            type: "POST",
            data: {
                select: "%Y-%c-%e",
                where: "%Y-%c-%e",
                d: this_td.attr("id"),
                order: "DATE_FORMAT(timestamp, '%H-%i')"
            },
            beforeSend: function() { $(".modal-body").html("<span class=\"loading\">Loading Termine...</span>"); },
            success: function(data) {
                getEvents(parseInt(this_td.children(".label").html()), data[this_td.attr("id")], this_td.attr("id"));
            },
            error: function () { getEvents(null, null, this_td.attr("id")); }
        });
}

function wdaysOriginal() {
    if ($("tr.weekdays").attr("id") == "sunday" && !weekdaysChanged) {
        weekdays.unshift(weekdays.pop());
        weekdaysChanged = true;
    }

    for (i = 0; i < 7; i++) {
        $("tr.weekdays").append("<th>" + weekdays[i] + "</th>");
    }
}

function daysInMonth(month, year) {
    return new Date(year, month, 0).getDate();
}

function Go(e) {
    if (e === "prev") {
        if (month === 1) { year -= 1; month = 12; }
        else { month -= 1; }
    }
    else if (e === "next") {
        if (month === 12) { year += 1; month = 1; }
        else { month += 1; }
    }
    else if (e === "today") { year = actual_y; month = actual_m; }

    days_number = daysInMonth(month, year);

    tbody.find("*").remove();
    tbody.val(getCalendar(year, month));

    $("span#anio").text(year);
    $("span#mes").text(m_text[month]);
}

function getCalendar(y, m) {
    function firstDay(month, year) {
        if ($(".weekdays").attr("id") == "sunday") { return new Date(year, (month - 1), 2).getDay(); }
        else { return new Date(year, (month - 1), 1).getDay(); }
    }

    $("span#mes").text(m_text[month]);
    $("span#anio").text(year);

    var diap = 1,
        empty = 0;

    firstDay = firstDay(m, y);
    // var daysLast = daysInMonth(m - 1, year) + 2;
    
    for (i = 1; i <= 7; i++) {
        if (firstDay === 0) {
            firstDay = 7;
        }
        if (i < firstDay) {
            if (i == 1) {
                tbody.append("<td class='border-left-off blank'><span></span></td>");
            }
            else {
                tbody.append("<td class='blank'><span></span></td>");
            }
            empty++;
        }
        else if (y == actual_y && m == actual_m && diap == actual_d) {
            if (i == 1) {
                tbody.append("<td id='" + y + "-" + m + "-" + diap + "' class='actual border-left-off'><span><a role='button' class='days' data-toggle='modal'>" + diap + "</a></span></td>");
            }
            else {
                tbody.append("<td id='" + y + "-" + m + "-" + diap + "' class='actual'><span><a role='button' class='days' data-toggle='modal'>" + diap + "</a></span></td>");
            }
            diap++;
        }
        else {
            if (i == 1) {
                tbody.append("<td id='" + y + "-" + m + "-" + diap + "' class='border-left-off'><span><a role='button' class='days' data-toggle='modal'>" + diap + "</a></span></td>");
            }
            else {
                tbody.append("<td id='" + y + "-" + m + "-" + diap + "'><span><a role='button' class='days' data-toggle='modal'>" + diap + "</a></span></td>");
            }
            diap++;
        }
    }

    tbody.wrapInner("<tr>");

    for (i = 1; i <= days_number; i++) {
        if (y === actual_y && m === actual_m && diap === actual_d) {
            if (i == 1 || i == 8 || i == 15 || i == 22 || i == 29) {
                tbody.append("<td id='" + y + "-" + m + "-" + diap + "' class='actual b border-left-off'><span><a role='button' class='days' data-toggle='modal'>" + diap + "</a></span></td>");
            }
            else {
                tbody.append("<td id='" + y + "-" + m + "-" + diap + "' class='actual b'><span><a role='button' class='days' data-toggle='modal'>" + diap  + "</a></span></td>");
            }
        }
        else {
            if (i == 1 || i == 8 || i == 15 || i == 22 || i == 29) {
                tbody.append("<td id='" + y + "-" + m + "-" + diap + "' class='border-left-off b'><span><a role='button' class='days' data-toggle='modal'>" + diap + "</a></span></td>");
            }
            else {
                tbody.append("<td id='" + y + "-" + m + "-" + diap + "' class='b'><span><a role='button' class='days' data-toggle='modal'>" + diap + "</a></span></td>");
            }
        }

        if (i % 7 === 0) { tbody.append("</tr><tr>"); }

        if (diap === days_number) {
            var numberOfWeeks = Math.ceil((days_number + empty) / 7),
                pre_total = days_number + empty,
                post_total = numberOfWeeks * 7;

            for (i = 1; i <= post_total - pre_total; i++) {
                tbody.append("<td class='b blank'><span></span></td>");
            }
            
            break;
        }

        diap++;
    }

    if ("sessionStorage" in window && window.sessionStorage !== null) { storage = sessionStorage; }
    else { alert("What an old browser! The webpage won´t work correctly with this browser, update it!"); }

    if (storage == sessionStorage && sessionStorage[y+"-"+m] !== undefined) {
        data = JSON.parse(sessionStorage.getItem(y+"-"+m));
        for (var key in data) {
            $("<span class='label label-success'>" + Object.keys(data[key]).length  + " " +  "Termin/e" + "</span>").prependTo($("#" + key));
        }
    }
    else {
        $.ajax({
            dataType: "json",
            url: "calendar/php/date.php",
            type: "POST",
            data: {
                select: "%Y-%c-%e",
                where: "%Y-%c",
                d: y + "-" + m,
                order: "timestamp, id"
            },
            beforeSend: function() { $("#loading").show(); },
            success: function(data) {
                sessionStorage[y+"-"+m] = JSON.stringify(data);
                for (var key in data) {
                    $("<span class='label label-success'>" + Object.keys(data[key]).length  + " " +  "Termin/e" + "</span>").prependTo($("#" + key));
                }
            },
            complete: function() { $("#loading").fadeOut(200); }
        });
    }
}

function getEvents(e, data, td_id) {

    
        $("#addEvent").remove();
        $(".modal-header").append("<button class='btn btn-small btn-success add' id='addEvent' onclick=\"addEvent('"+ td_id + "');\">Ich möchte auch einen Termin</button>");
    

    $(".modal-body").empty();
    $(".modal-footer").empty();

    if (e !== null) {
        if (e > 4 && page > 1 && e - (showEvents[showEvents.length-1]+1) !== 0 && typeof(showEvents[3]) !== "string") {
            $(".modal-footer").append("<a class='next' onclick=\"pageEvents('more', '" + e + "')\" href='javascript:void(0)'></a>");
            $(".modal-footer").append("<a class='prev' onclick=\"pageEvents('less', '" + e + "')\" href='javascript:void(0)'></a>");
        }
        else if (e > 4) {
            if (e - showEvents[showEvents.length-1] >= 1) {
                $(".modal-footer").append("<a class='next' onclick=\"pageEvents('more', '" + e + "')\" href='javascript:void(0)'></a>");
            }
            if (page > 1) {
                $(".modal-footer").append("<a class='prev' onclick=\"pageEvents('less', '" + e + "')\" href='javascript:void(0)'></a>");
            }
        }

        for (i = 0; i < showEvents.length; i++) {
            try {
                if (showEvents[i] != "null") {
                    data[i] = data[showEvents[i]];
                }
                else {
                    break;
                }

                time = data[i].timestamp.replace(/-|:/g, " ").split(" ").slice(3, 6);
                time = new Date(2000, 01, 01, time[0], time[1], time[2]);

                time = {
                    hours: time.getHours(),
                    minutes: time.getMinutes() < 10 ? "0" + time.getMinutes() : time.getMinutes(),
                    ampm: (time.getHours() < 12 ? "am" : "pm")
                }

                if (time_format == "standard") {
                    time.hours = (time.hours > 12) ? time.hours - 12 : time.hours;
                    time = time.hours + ":" + time.minutes + time.ampm;
                }
                else if (time_format == "military") {
                    time = time.hours + ":" + time.minutes + " " + "Uhr";
                }
                time2 = data[i].timestamp.replace(/-|:/g, " ").split(" ").slice(3, 6);
                time2 = new Date(2000, 01, 01, time2[0], time2[1], time2[2]);

                time2 = {
                    hours: time2.getHours(),
                    minutes: time2.getMinutes() < 10 ? "0" + time2.getMinutes() : time2.getMinutes(),
                    ampm: (time2.getHours() < 12 ? "am" : "pm")
                }

                if (time_format == "standard") {
                    time2.hours = (time2.hours > 12 ) ? time2.hours - 12 : time2.hours;
                    time2 = time2.hours + ":" + time2.minutes + time2.ampm;
                }
                else if (time_format == "military") {
                bz = data[i].beratungszeit;   
                
                time2.hours = parseInt(time2.hours) + parseInt(bz);
                time2 = time2.hours + ":" + time2.minutes + " " + "Uhr";
                }
                 if (data[i].location === null) {
                    
                    $(".modal-body").append("<div id='event'><span class='title'><h4 style='margin: 24px 0px'>" + data[i].title + "</h4></span><span class='time'><span style='width: 278px; float: left;'><span class='glyphicon glyphicon-time' style='top: 2px'></span> " + time + "  -  " + time2 + "</span></span></div>");
                }
                else {
                    $(".modal-body").append("<div id='event'><span class='title'><h4>Bereich: " + data[i].title + "</h4><p>in der Filiale:  <i><strong>" + data[i].location + "</i></strong></p></span><span class='time'><span style='width: 278px; float: left;'><span class='glyphicon glyphicon-time' style='top: 2px'></span> " + time + "  -  " + time2  + "</span></span></div>");
                }
            }
            catch (err) {}
        }
    }
    else {
        $(".modal-body").append("<span class='not-found'>Keine Kunden-Termine vorhanden.</span>");
    }
}

function pageEvents(lessmore, e) {
    if (lessmore == "less") {
        page -= 1;

        for (key in showEvents) {
            showEvents[key] -= 4;
        }

        getFirstEvents();
    }
    else if (lessmore == "more") {
        page += 1;

        for (key in showEvents) {
            if (showEvents[key]+4 < e) {
                showEvents[key] += 4;
            }
            else {
                showEvents[key] += 4;
                showEvents[key] = "" + showEvents[key] + "";
            }
        }

        getFirstEvents();
    }
}

function addEvent(date) {
    $(".modal-header").html(modalAddEvent.header);
    $(".modal-body").html(modalAddEvent.body);
    $(".modal-footer").html(modalAddEvent.footer).addClass("Meinen Kunden-Termin hinzufügen");

    $("#inputDate").datepicker({ firstDay: 1 });
    
    if (time_format == "standard") {
        $("#inputTime").timepicker({
            timeFormat: 'hh:mm tt'
        });
    }
    else {
        $("#inputTime").timepicker();
    }

    date = date.split("-");
    date = date[1] + "/" + date[2] + "/" + date[0];

    $("#inputDate").val(date);

    $("button#add").on("click", function() {
        form = { title: $("#inputTitle").val(),
                 location: $("#inputLocation").val(),
                 berater: $("#inputBerater").val(),
                 beratungszeit: $("#inputBeratungszeit").val(),
                 anrede: $("#inputAnrede").val(),
                 vorname: $("#inputVorname").val(),
                 nachname: $("#inputNachname").val(),
                 strasse: $("#inputStrasse").val(),
                 nr: $("#inputNr").val(),
                 plz: $("#inputPlz").val(),
                 ort: $("#inputOrt").val(),
                 telefon: $("#inputTelefon").val(),
                 email: $("#inputEmail").val(),
                 bemerkung: $("#inputBemerkung").val(),
                 date: $("#inputDate").val(),
                 time: $("#inputTime").val() };

        title = form.title;
        loc = form.location;
        berater = form.berater;
        beratungszeit = form.beratungszeit;
        anrede = form.anrede;
        vorname = form.vorname;
        nachname = form.nachname;
        strasse = form.strasse;
        nr = form.nr;
        plz = form.plz;
        telefon = form.telefon;
        email = form.email;
        bemerkung = form.bemerkung;
        date = new Date(form.date);
        date = date.getFullYear() + "-" +
               (date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1) + "-" +
               (date.getDate() < 10 ? "0" + date.getDate() : date.getDate());
        time = form.time + ":00";

        if (time_format == "standard") {

            if (time.indexOf("am") > -1) {
                
                time = form.time.split(" ")[0];
                original = time.split(":");
                
                if (parseInt(original[0]) == 12) {
                    time = "00:" + original[1];
                }
            }
            else {
                time = form.time.split(" ")[0];
                original = time.split(":");

                if (parseInt(original[0]) != 12) {
                    timePm = parseInt(original[0]) + 12;
                    time = timePm + ":" + original[1];
                }
            }
        }

        timestamp = date + " " + time;

        if ((title && loc && timestamp && berater && beratungszeit && anrede && vorname && nachname && strasse && nr && plz && ort && telefon && email && bemerkung) !== "") {
            form_data = { 1: title, 2: loc, 3: timestamp, 4: berater, 5: beratungszeit, 6: anrede, 7: vorname, 8: nachname, 9: strasse, 10: nr, 11: plz, 12: ort, 13: telefon, 14: email, 15: bemerkung };
            
            $.ajax({
                type: "POST",
                data: { action: "insert",
                        title: form_data[1],
                        loc: form_data[2],
                       timest: form_data[3] ,
                        berater: form_data[4],
                        beratungszeit: form_data[5],
                       anrede: form_data[6],
                       vorname: form_data[7],
                       nachname: form_data[8],
                       strasse: form_data[9],
                       nr: form_data[10],
                       plz: form_data[11],
                       ort: form_data[12],
                       telefon: form_data[13],
                       email: form_data[14],
                       bemerkung: form_data[15] },
                url: "calendar/admin/php/func_events.php",
                beforeSend: function() { $("button#add").button("loading"); },
                success: function() {
                    $("#myModal").modal("hide");

                    sessionStorage.clear();
                    window.location.reload();
                },
                error: function() { alert("Beim Hinzufügen des Ereignisses ist ein Fehler aufgetreten."); }
            });
        }
        else {
            alert("Sie müssen alle Felder ausfüllen.");
        }
    });
}

$(window).resize(function() {
    var width = $(window).width();
    if (width < 960) {
        wdaysOriginal();
        $("tr.weekdays").empty();

        for (i = 0; i < 7; i++) {
            weekdays[i] = weekdays[i].substring(0, 3);
            $("tr.weekdays").append("<th>" + weekdays[i] + "</th>");
        }
    }
    else {
        $("tr.weekdays").empty();
        wdaysOriginal();
    }
});

// Arrows shorcuts
$(document).keydown(function(e) {
    var key = e.which;
    
    if (key == "37") { Go("prev"); }
    if (key == "39") { Go("next"); }
});

var modalAddEvent = { header: "<button type='button' class='close' data-dismiss='modal' aria-hidden='true'>&times;</button><h3 id='myModalLabel'   style='color:green'>Kunden-Termin hinzufügen</h3>",
                         body: "<form class='form-horizontal' id='addEvent' action=' method='post'>" +
                                    "<div class='form-group'>" +
                                        "<label class='col-sm-3 control-label' for='inputTitle'>Wohnbereich</label>" +
                                        "<div class='col-sm-7'>" +
                                            "<select class='form-control'  id= 'inputTitle'>"+
                                              "<option value='Küche'>Küche & Bad</option>"+
                                              "<option value='Wohnen'>Wohnzimmer, Essbereich, Relaxsessel</option>"+
                                              "<option value='Schlafen'>Schlafzimmer</option>"+
                                           " </select>" +
                                        "</div>" +
                                    "</div>" +
                                    "<div class='form-group'>" +
                                        "<label class='col-sm-3 control-label' for='inputLocation'>Filiale</label>" +
                                        "<div class='col-sm-7'>" +
                                            "<select class='form-control' id= 'inputLocation'>"+
                                              "<option value='Göttingen'>Göttingen</option>"+
                                              "<option value='Witzenhausen'>Witzenhausen (Klick & Meet)</option>"+
                                              "<option value='Oberdorla' >Oberdorla (Klick & Meet)</option>"+
                                              "<option value='Worbis'  disabled>Worbis (zur Zeit geschlossen)</option>"+
                                           " </select>" +
                                        "</div>" +
                                    "</div>" +
                                    "<div class='form-group'>" +
                                        "<label class='col-sm-3 control-label' for='inputDate'>Wunsch-Datum</label>" +
                                        "<div class='col-sm-7'>" +
                                            "<input type='text' id='inputDate' class='form-control' maxlength='10'  />" +
                                        "</div>" +
                                        "<div id='datepicker'></div>" +
                                    "</div>" +
                                    "<div class='form-group'>" +
                                        "<label class='col-sm-3 control-label' for='inputTime'>Zeit</label>" +
                                        "<div class='col-sm-7'>" +
                                            "<input type='text' id='inputTime' class='form-control' maxlength='5' />" +
                                        "</div>" +
                                    "</div>" +
                                    "<hr style='border-color:#0088cb' />" +
                                     "<h3 id='myModalLabel'  style='color:green'>&nbsp;&nbsp;&nbsp;Kunden-Daten</h3>"+
                                    "<hr style='border-color:#0088cb' />" +
                                    "<div class='row'>" +
                                        "<div class='col-lg-12'>" +
                                            "<div class='col-sm-7 col-lg-4'>" +
                                                 "<select class='form-control' id= 'inputAnrede'>"+
                                                      "<option value='Frau'>Frau</option>"+
                                                      "<option value='Herr'>Herr</option>"+
                                                  "</select>" +
                                            "</div>" +
                                            "<div class='col-sm-7 col-lg-4'>" +
                                                "<input type='text'   id='inputVorname'   class='form-control'   placeholder='Vorname'/>" +
                                            "</div>" +
                                            "<div class='col-sm-7 col-lg-4'>" +
                                                "<input type='text'   id='inputNachname'   class='form-control'   placeholder='Nachname'/>" +
                                            "</div>" +
                                            "<div class='col-sm-7 col-lg-12'>" +
                                            "<br />" +
                                            "</div>" +
                                              "<div class='col-sm-7 col-lg-4'>" +
                                                "<input type='text'   id='inputStrasse'   class='form-control'   placeholder='Strasse'/>" +
                                            "</div>" +
                                            "<div class='col-sm-7 col-lg-2'>" +
                                                "<input type='text'   id='inputNr'   class='form-control'   placeholder='Nr'/>" +
                                            "</div>" +
                                              "<div class='col-sm-7 col-lg-2'>" +
                                                "<input type='text'   id='inputPlz'   class='form-control'   placeholder='PLZ'/>" +
                                            "</div>" +
                                            "<div class='col-sm-7 col-lg-4'>" +
                                                "<input type='text'   id='inputOrt'   class='form-control'   placeholder='Ort'/>" +
                                            "</div>" +
                                            "<div class='col-sm-7 col-lg-12'>" +
                                            "<br />" +
                                            "</div>" +
                                            "<div class='col-sm-7 col-lg-6'>" +
                                                "<input type='text'   id='inputTelefon'   class='form-control'   placeholder='Telefon / Mobil'/>" +
                                            "</div>" +
                                            "<div class='col-sm-7 col-lg-6'>" +
                                                "<input type='text'   id='inputEmail'   class='form-control'   placeholder='Email'/>" +
                                            "</div>" +
                                             "<div class='col-sm-7 col-lg-12'>" +
                                            "<br />" +
                                            "</div>" +
                                            "<div class='col-sm-7 col-lg-12'>" +
                                                "<label class= 'col-sm-3 for= 'inputBemerkung'>Bemerkung</label>" +
                                                "<textarea class='form-control' rows= '3'  id='inputBemerkung'></textarea>" +
                                            "</div>" +
                                            "<input type='hidden'   id= 'inputBeratungszeit'  class='form-control'   value='0'/>" +
                                            "<input type='hidden'   id= 'inputBerater'  class='form-control'   value='0'/>" +
                                    "</div>" +
                      "</div>" +
                                "</form>",
                         footer: "<button type='button' id='add' class='btn btn-success' data-loading-text='Adding event...'>Meinen Kunden-Termin hinzufügen</button>" };
 

Anhänge

  • Bildschirmfoto 2021-05-04 um 10.28.20.png
    Bildschirmfoto 2021-05-04 um 10.28.20.png
    15,7 KB · Aufrufe: 0
Zurück