Beiträge von Sempervivum

    Das ist relativ einfach, wenn man weiß, wie es geht.

    Zunächst das Javascript, am Ende des bisherigen Codes einfügen:


    var params = {
    sThema: rows[rowIdx].cells[0].innerHTML,
    sDatum: rows[rowIdx].cells[1].innerHTML,
    sUhrzeit: rows[rowIdx].cells[2].innerHTML,
    sOrt: rows[rowIdx].cells[3].innerHTML
    };
    $.post("sidebar-schreiben.php", params, function (data) {
    var s = data;
    });

    Dann das PHP, dieses musst Du in eine Datei sidebar-schreiben.php einfügen:


    <?php
    $thehtml = ' <div id="sidebar">
    <h4>Neue Termine:</h4>
    <table id="sidebartabelle">
    <tr>
    <td id="sThema">' . $_POST['sThema'] . '</td>
    </tr>
    <tr class="zweitezeile">
    <td id="sDatum">' . $_POST['sDatum'] . '</td>
    </tr>
    <tr>
    <td id="sUhrzeit">' . $_POST['sUhrzeit'] . '</td>
    </tr>
    <tr class="zweitezeile">
    <td id="sOrt">' . $_POST['sOrt'] . '</td>
    </tr>
    </table>
    </div>';
    file_put_contents("sidebar.html", $thehtml);
    echo $thehtml;
    ?>

    Dann wird eine Datei sidebar.html angelegt. Damit es funktioniert, muss PHP verfügbar sein. Wenn Du es lokal testen willst, musst Du einen Server mit PHP auf deinem Computer installieren. XAMPP ist ein verbreitetes Paket. Auf jeden Fall zu empfehlen, wenn Du PHP lernen willst.

    Die Datei sidebar.html kannst Du dann in deine anderen Seiten mit PHP-Include einbinden:
    <?php include('sidebar.html'); ?>


    Viel Erfolg!

    Das lässt sich leicht beheben:

    var terminauswahl = document.getElementById("terminauswahl");
    terminauswahl.innerHTML = "";
    for (var i = 0; i < rows.length; i++) {
    var currentTime = myParseDate(rows, i).getTime();
    if (currentTime > now || i == 0) {
    var timeStr = rows[ i ].cells[1].innerHTML + " " + rows[ i ].cells[2].innerHTML;
    var opt = document.createElement("option");
    opt.value = timeStr;
    opt.innerHTML = timeStr;
    terminauswahl.appendChild(opt);
    }
    }

    Zitat

    Und mir ist noch ein anderes Problem aufgefallen die Sidebar funktioniert nicht auf anderen Seiten...

    Das liegt daran, dass alles, was man mit Javascript macht, auf die aktuelle Seite beschränkt ist. Will man die Sidebar auf allen Seiten haben, muss man PHP einbeziehen: Mit Ajax die Daten an den Server übertragen; das PHP-Skript generiert das HTML und trägt es in eine Datei ein; diese kannst Du dann auf allen Seiten mit PHP-Include einbinden. Wenn Du das brauchst, kann ich es für dich programmieren.

    Zitat

    Dann muss ich die Options aber noch mit: ... füllen, oder?

    Das tut das Script schon, siehe am Ende des Javascript-Abschnitts.

    Zitat

    Aber dann wenn nur z.B. 2 Termine aktuell sind, sind auch 3 Felder leer...

    Das kann man leicht vermeiden, indem man die options nicht nur mit Inhalt füllt, sondern auch automatisch anlegt:


    var terminauswahl = document.getElementById("terminauswahl");
    terminauswahl.innerHTML = "";
    for (var i = 0; i < rows.length; i++) {
    var time = rows[ i ].cells[1].innerHTML + " " + rows[ i ].cells[2].innerHTML;
    var opt = document.createElement("option");
    opt.value = time;
    opt.innerHTML = time;
    terminauswahl.appendChild(opt);
    }

    Da Du den Zellen IDs gegeben hast, ist es noch einfacher:


    rows[rowIdx].style.backgroundColor = "lightblue";
    rows[rowIdx].style.border = "thin solid blue";
    document.getElementById("sThema").innerHTML = rows[rowIdx].cells[0].innerHTML;
    document.getElementById("sDatum").innerHTML = rows[rowIdx].cells[1].innerHTML;
    document.getElementById("sUhrzeit").innerHTML = rows[rowIdx].cells[2].innerHTML;
    document.getElementById("sOrt").innerHTML = rows[rowIdx].cells[3].innerHTML;

    Zitat

    Und habe ich den Code richtig verstanden, dass der aktuelle Termin auch nach der Uhrzeit aktualisiert wird?

    Ja, die Uhrzeit wird auch berücksichtigt, d. h. wenn zwei Termine am selben Tag sind wird der frühere hervor gehoben.

    Zitat

    Aber wie spreche ich die andere Tabelle separat an? Mit der ID?

    Richtig, Du musst der zweiten Tabelle eine andere ID geben und kannst dann mit

    JavaScript
    row[i].cell[j].innerHTML

    den Inhalt jeder Zellen setzen. Wenn Du es noch nicht selber kannst, dann poste das HTML der Tabelle, wo es angezeigt werden soll und ich zeige dir, wie es geht.

    Zitat

    ... erstmal JavaScript so zu lernen, dass ich mir selber helfen kann..

    Dann bist Du hier schon an der richtigen Adresse, denn es gibt Tutorials, u. a. auch für Javascript.

    Zitat

    ob dein Code das Datum aus HTML quasi erkennt, das heißt, kann ich also das Datum in der Tabelle in HTML ändern und JavaScript erkennt das oder?

    Genau, die Funktion myParseDate liest die beiden Strings für Datum und Uhrzeit jeweils aus der aktuellen Zeile aus und macht daraus ein Date-Objekt.

    Zitat

    Also in jeder Tabellenspalte wird das Workshopthema angezeigt, das Datum, die Uhrzeit und der Ort. Jetzt will ich alle diese Sachen NUR von dem aktuellsten Datum dem "eingerahmten" in einer neuen Tabelle (Sidebar) anzeigen lassen, wie mache ich das?

    Am Ende des Skripte steht in der Variablen rowIdx der Index der Zeile mit dem nächsten Termin. Dort kannst Du die Werte auslesen.
    rows[rowIdx],cells[3].innerHTML liefert z. B. den Ort der Veranstaltung.

    Die Meldung von Dreamweaver kannst Du ignorieren.

    Ich hoffe, dies ist das, was Du dir vorgestellt hast:
    http://pastebin.com/MZe1bMrC

    Damit "border" für die Zeile funktionierte, musste ich das CSS "border-collapse:collapse" hinzu fügen, siehe:
    http://stackoverflow.com/questions/1867…ent-doesnt-show


    PS: Ich habe da noch einen kleinen Fehler gemacht. So ist es richtig:


    function myParseDate(rows, rowIdx) {
    var datearr = rows[rowIdx].cells[1].innerHTML.split(".");
    var timearr = rows[rowIdx].cells[2].innerHTML.split(":");
    return new Date(parseInt(datearr[2]), parseInt(datearr[1]) - 1, parseInt(datearr[0]),
    parseInt(timearr[0]), parseInt(timearr[1]), 0);
    }

    (vorletzte Zeile)