SwissChecklist

Checklist: DotNetNuke - Erste Schritte mit Form and List

Wenn du noch nie mit Form and List gearbeitet hast, es aber gerne möchtest, kannst du hier gleich loslegen.

  • Einführung

    Show Details Show Substeps Show Substeps Show Substeps
    Die Einführung gibt dir einen Einblick was mit diesem Modul alles möglich ist. Vorkenntnisse: keine nötig wird alles erklärt

    Ausgangslage: Du hast DotNetNuke lauffähig bereit und Form and List installiert!

  • DotNetNuke ist funktionsfähig und Form and List installiert

    Show Details Show Substeps Show Substeps Show Substeps
    Falls dies nicht der Fall ist kannst du auf
    • [http://www.dotnetnuke.com/Products/OnlineDemo/tabid/1239/Default.aspx DotNetNuke] gehen und ein Demo Account erstellen!

  • Füge das Modul Form and List auf der gewünschten Seite ein

    Show Details Show Substeps Show Substeps Show Substeps
    Modul auswählen - Pane auswählen wo es eingefügt werden soll und auf "Add Module To Page" klicken. Das Modul Form and List erscheint nun auf der Seite.

  • Füge nun 5 Felder hinzu z.B. Name, Vorname, Adresse, Telefonnummer, Land

    Show Details Show Substeps Show Substeps Show Substeps
    "Form and List Configuration" anwählen, Data Table Setup erscheint zu oberst.
    Jetzt auf "Add New Column" klicken, Name des Feldes eingeben und den Typ auswählen in diesem Fall z.B.:
    • Vorname = Text
    • Nachname = Text
    • Adresse = Rich Text (HTML)
    • Telefonnummer = Integer -> Output Format = +41.###.###.##.## den Rest leer lassen
    • Land = Text -> List of Values = z.B. Schweiz;Liechtenstein;Deutschland
    • E-Mail = Email

    Man könnte auch alle Feld als Textfelder deklarieren, dass ist dir überlassen!
    Das ganze abspeichern um die Änderungen nicht zu verlieren. (Save Configuration and Return)

  • Füge min 2-3 Datensätze ein

    Show Details Show Substeps Show Substeps Show Substeps
    Unter dem Modul auf "Add Record" klicken und alle Felder ausfüllen.
    Wenn alle Felder gefüllt sind speichern und beliebig wiederholen.

  • Erweitere das Formular nach eigenen wünschen und probiere verschiedene Feld Typen aus

    Show Details Show Substeps Show Substeps Show Substeps
    z.B.
    • ein Bild einfügen indem ihr den Feld Typ "Image" auswählt
    • ein Link einfügen indem ihr den Feld Typ auf "Link" stellt

  • Übersicht - Hintergrund informationen über:

    Show Details Show Substeps Show Substeps Show Substeps
    Hier das ganze noch ein bisschen Detailierter zum Verständnis

  • Felder hinzufügen

    Show Details Show Substeps Show Substeps Show Substeps
    Du erstellst verschieden Felder welche nachher als Eingabemaske für die Datenbank verwendet werden

  • Felder ausfüllen

    Show Details Show Substeps Show Substeps Show Substeps
    Du füllst die Felder, und sendest sie an den Server welche diese speichert.

  • Das Formular für die Eingabe, die Listenansicht

    Show Details Show Substeps Show Substeps Show Substeps
    Das Formular ist die Eingabemaske welche die Datensätze an den Server übermittelt mit den zugehörigen Feld Attributen.
    Die Listenansicht zeigt die Datensätze welche du vorher eingegeben hast. Die Darstellung wird von dem Stylesheet gehandhabt.

  • Form and List

    Show Details Show Substeps Show Substeps Show Substeps
    Form and List besteht aus drei verschiedenen Komponenten.
    • Datenbank -> Speicherort für die Daten (vorkonfiguriert)
    • Eingabemaske -> Felder um die Daten einzugeben
    • Ausgabe -> Gibt die Daten aus und zeigt sie im Browser an

    Die Ausgabe wird mit einem Stylesheet definiert, so dass der User z.B. nicht nur die Datensätze sieht, sondern eine Tabelle mit Überschrift.
    Das Stylesheet besteht aus einem XSLT Script.

  • Die Darstellung selbst bestimmen (Stylesheet)

    Show Details Show Substeps Show Substeps Show Substeps
    Hier lernst du wie man ohne grossen Aufwand die Darstellung manuell abändern kann.

  • Die Darstellung von der Vorlage auf Manuell umstellen

    Show Details Show Substeps Show Substeps Show Substeps
    Auf Form and List Configuration klicken, danach zum Untermenü List Settings und dort von "Default Grid Table"(Standart Vorlage) auf "XSLT using self made Stylesheets"(Editierbare Vorlage) wechseln

  • Neues Stylesheet generieren

    Show Details Show Substeps Show Substeps Show Substeps
    Nach dem wechsel von der Standart Vorlage auf die Manuell Editierbare Vorlage erscheint nun "Generate New" klicke darauf und es erscheint das HTML Template und das Stylesheet (XSLT Script).

    Beim HTML Template sieht man die Felder welche angezeigt werden sollen bei der Listenansicht. z.B. du findest die E-mail muss vor Spam geschütz werden dann kannst du das Feld E-Mail löschen. Die Daten bleiben aber noch in der Datenbank jedoch werden sie nicht mehr angezeigt!

    Nach dem du das verändert hast Klicke auf "Generate from HTML Template"
    um das Stylesheet (XSLT Script) zu generieren.
    Es erscheint im Feld "Edit XSLT Script" der Code.

    Jetzt gib dem Stylesheet noch ein passenden Namen und die Endung ".xls" und klicke auf Save File and Return! Nocheinmal ganz unten auf Save Configuration and Return klicken. Voilà du hast eben dein eigenes Stylesheet erstellt.

  • Um den ganzen Code zu verstehen und umstrukturieren muss folgendes gemacht werden:

    Show Details Show Substeps Show Substeps Show Substeps
    [http://w3schools.com/html/default.asp HTML] lernen und Tutorials lösen
    [http://w3schools.com/xml/default.asp XML] lernen
    [http://w3schools.com/xsl/default.asp XSLT] lernen und Tutorials anwenden beim Modul
    [http://w3schools.com/xpath/default.asp XPath] lernen

  • Zusammenfassung

    Show Details Show Substeps Show Substeps Show Substeps
    Du hast nun begriffen:
    • Wie man beim Formular neue Felder macht und Ihnen Typen zuweist
    • Wie man Daten in das Formular eingibt und das Resultat ansieht
    • Wie die Felder, Modul, Formular im groben funktionieren
    • Wie man das Stylesheet manuell verändern kann ohne grossen Aufwand
    • Wo man HTML/XSLT erlernen und andwenden kann

  • Viel Glück

    Show Details Show Substeps Show Substeps Show Substeps

  • New Step

    Show Details Show Substeps Show Substeps Show Substeps
Use this Checklist

Preview/Print

Use

Change

Sort

Delete Template