7. Aufgabe ( Client-Server) Online-Liste für Terminabstimmung

Konrad Zuse: "Die Zukunft gehoert jenen jungen Menschen, welche den technischen Fortschritt unserer Zeit am besten zu nutzen verstehen."

Zur Vorbereitung dieses Projektes können die folgenden Hinweise zu HTML-Formularen nützlich sein: Schnelleinstieg zu Formularen , AJAX from Scratch im Vergleich zu Formularen, das Validieren von Formular-Eingaben bei SDI und bei MDI und Self-Assessments zu Formularen .

Projekt-Ziele sind:


Einführendes Um was geht es?

Für Personen, die an unterschiedlichen Orten wohnen, soll eine Client-Server-App entwickelt und getestet werden, die aus Anlaß einer gemeinsamen Terminfindung (z.B. Online-Umfrage, Einladungsoptionen für ein Gruppentreffen, Jahrgangstreffen, Vorstandssitzung, Konferenz, Familientreffen, usw.) erforderlich ist.

Abstimmungsliste und Abstimmungsformular Wie solls aussehen?

Wichtige "Projekt-Denk-Kategorien" sind die Gewichtungen von Client/Server. Wie sieht die online-Abstimmungsliste aus? Wie sieht das online-Abstimmungsformular aus? Wie wird die Daten-Persistenz erreicht und im aktuelle Stand in der online-Abstimmungsliste präsentiert?

Formale Grob-Strukturierung des Projektes etwa:

 'umfrage_titel'        :  ( h1-Tag )
 'umfrage_beschreibung' :  ( p -Tag )
 'umfrage_ende'         :  ( p -Tag mit dem Ende )
 'trennlinie'           :  ( hr-Tag )

 'auswahl_möglichkeiten':  { 'a...',   ['...', '...', '...'  ] }
 'auswahl_items'        :  {'myname1', [  '0',   '1',   '0'  ] }
 'auswahl_items'        :  {'myname2', [  '1',   '0',   '1'  ] }
 'auswahl_items'        :  {'myname2', [  '0',   '1',   '1'  ] }
 'trennlinie'           :  ( hr-Tag;)
 'form_start'           :  ( 'Bitte hinzufügen: neu->' )
 'form_elements'        :  { type:"text" name:"NAME"
                            [type="checkbox", type="checkbox", type="checkbox", 
                             type="submit"
                            ]
                           }
 'trennlinie'           :  ( hr-Tag; )
 'auswahl_summen_akt'   :  { 'Aktuelle Summen ',  ['sum', 'aum', 'sum'  ] }

Aussehen der HTML-Abstimmungsseite etwa:

  <!--'umfrage_titel'-->
  Bisherige Abstimmungsliste ... :

              |      mögliche Termine     |
              |   Mi 18 |  Do 19 |  Sa 21 |
   ------------------------------------------
      Hans    |         |   x    |        |
      Werner  |    x    |        |   x    |
      Ute     |         |   x    |   x    |
   ------------------------------------------
Bitte hinzufügen:
neu->[ Name ] |   [ ]   |  [ ]   |  [ ]   |  [ send ]
   ------------------------------------------
bisher abgegeben:  1        2        2
Stufenfolge der Projekt-Durchführung Wie?

Damit die Lernschritte und der Ausführungsaufwand überschaubar bleiben, ist eine Stufenfolge der Projekt-Durchführung sinnvoll. Diese wird in der Veranstaltung besprochen.

Ambrose Bierce: "Wissen nennen wir jenen kleinen Teil der Ungewissheit, den wir geordnet und klassifiziert haben."

Als Vorbereitung kann nützlich sein: Schnelleinstieg zu Formularen , AJAX from Scratch im Vergleich zu Formularen, das Validieren von Formular-Eingaben bei SDI und bei MDI und Self-Assessments zu Formularen und die konkrete Bearbeitung von
Terminabstimmung-1-htm und die konkreten Bearbeitungen von
Terminabstimmung-2-php und
Terminabstimmung-3-php

Einige Fragen zu PHP/ECMAScript Wie Client/Server gewichten?

Hier sind einige weitere ( optionale ) Fragen zum serverseitigen PHP und den Zusammenhang mit clientseitigem ECMAScript.

  1. Was liefert die PHP-Funktion count($_POST) ?
  2. Was liefert der ECMAScript-Aufruf arr.length ?
  3. Was liefert die PHP-Funktion implode('|',$_POST) ?
  4. Was liefert der ECMAScript-Aufruf arr.join('|') ?
  5. Was bewirken die PHP-Funktionen
    date_default_timezone_set('Europe/Berlin');
    $s = date('Y_m_d_H_i', time());
    
  6. Was liefern die folgenden ECMAScript-Aufrufe?
    var a = [ ];
    var t = new Date(doc.lastModified);                   // ...
    a.push(t.getUTCFullYear());                           // ...
    a.push(String('0' + (t.getUTCMonth()+1)).slice(-2));  // ...
    a.push(String('0' + t.getUTCDate()).slice(-2));       // ...
    a.push(String('0' + t.getUTCHours()).slice(-2));      // ...
    a.push(String('0' + t.getUTCMinutes()).slice(-2));    // ...
    a.push(String('0' + t.getUTCSeconds()).slice(-2));    // ...
    
  7. Wenn $my_url = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF']; ist, was ergibt dann für
    $my_url_kurz = preg_replace('/^.+\/(.*?)\..+$/', '$1', $my_url);
    
  8. Was liefern die folgenden ECMAScript-Aufrufe für my_url_kurz ?
    var my_url = location.href,
        my_url_kurz = my_url.replace(/^.+\/(.*?)\..+$/', '$1', my_url);
    
  9. Was liefert str_replace( '.', '_', $_SERVER['REMOTE_ADDR'] )?
  10. Wovor schützt die Funktion htmlspecialchars(), wie z.B. bei htmlspecialchars($_POST['NAME'],ENT_NOQUOTES) ?
  11. Was wird für echo "äöüÄÖÜß"; angezeigt, wenn die Datei nicht als UTF-8 gespeichert wurde?
  12. Was liefert der folgende ECMAScript-Ausdruck für s2, wenn s1 = "äöüÄÖÜß"; ist?
    var s2, s1 = "äöüÄÖÜß";
    try { s2 = win.unescape(encodeURIComponent(s1)); } catch (e) { }
    alert( 's1 liefert s1 = "' + s1 + '" mit s1.length = ' + s1.length );
    alert( 's2 liefert s2 = "' + s2 + '" mit s2.length = ' + s2.length );
    
  13. Beim Validieren einer Seite kommt die Fehlermeldung "Forbidden code point U+xxxx". Was bedeutet das?
  14. Was bewirkt
    $str = 'Hallo Welt';
    printf("<script>%s</script>",'var arr_of_obj = '.$str.'];');
    
    und wozu dient dies?
  15. Was passiert, wenn anstelle von einem exit;-Aufruf header("Location: ".my_url_string); steht?
  16. Ein Eingabefehler ( z.B. zu wenig Zeichen ) in einem input-Tag tg kann mit ECMAScript durch
    tg.style.border = '1px solid #f00;'; 
    setTimeout (function () { tg.style.border=''; }, 1000); 
    
    sichtbar gemacht werden. Welche einfachen Methoden sind universeller, günstiger?
  17. Der globale Array $_POST enthalte $_POST['NAME'] = 'Jürgen'; Wie speichert json_encode($_POST) den Wert 'Jürgen'?
Optionale Erweiterungen universell, flexibel, robust

Das obige Konzept soll verallgemeinert werden und z.B. von einer Terminumfrage auf allgemeine Online-Umfragen erweitert werden. Die folgenden Punkte können betrachtet werden:

Viel Freude bei der Ausarbeitung!
Letzter Abgabetermine So 12.00 Uhr