Crashkurs 101
10 Module
5 Wochen

Web-Seiten und Modale

Zum Kopieren anklicken

Wie man neue Seiten und modale Fenster in Webanwendungen erstellt


Der wichtigste Schritt bei der Erstellung der meisten Webanwendungen ist die Organisation ihrer Arbeit mit der Datenbank. Wie holt man Daten aus der Datenbank, wie stellt man sie auf dem Bildschirm des Benutzers dar, und wie verwaltet und löscht man diese Daten.

Genau diesen Fragen ist das neue Modul gewidmet. Im dritten Modul haben wir eine Datenbank erstellt und Modelle entworfen, um Informationen über Städte und Länder zu erfassen. Jetzt werden wir die Arbeit mit dieser Datenbank organisieren. Dazu müssen wir Folgendes tun:

  • Erstellen einer Tabelle zur Ausgabe von Informationen aus der Datenbank
  • Lernen, wie man der Datenbank Daten hinzufügt und wie man sie löscht
  • lernen, wie modale Fenster funktionieren, um eine benutzerfreundliche Schnittstelle zu schaffen
  • Verstehen, wie verknüpfte Tabellen funktionieren

Seiten

Beginnen wir mit dem vorbereitenden Teil. Unsere App wird immer größer, und sie ist auf einer Seite zu eng. Wir müssen mindestens eine weitere Seite erstellen. Fügen wir sie dem linken Menü hinzu.


Wir nennen die erstellte Seite "World" und legen das Symbol und eine eindeutige URL fest.


Modale Fenster

Wir brauchen die Möglichkeit, neue Länder auf der erstellten Seite hinzuzufügen. Dazu benötigen wir ein modales Fenster, in das wir die erforderlichen Daten eingeben, und eine Schaltfläche, die dieses modale Fenster öffnet.

Das modale Fenster ist eine besondere Komponente. Es nimmt keinen bestimmten Platz auf der Seite ein und vereint gleichzeitig die Eigenschaften der Komponente (mit komponentenspezifischen Einstellungen) und der neuen Seite (mit einer eigenen Arbeitsfläche zum Hinzufügen weiterer Komponenten). Der am besten geeignete Platz für ein Modal ist der Bereich am unteren Rand der Seite. Er ist grün hervorgehoben, ebenso wie die modale Komponente selbst.


Es ist notwendig, ihm einen passenden Namen zu geben und beim Drücken der Schaltfläche eine einfache Aktion zuzuweisen - die Anzeige dieses modalen Fensters.


Der nächste Schritt besteht darin, die erforderlichen Daten einzugeben. Einen ähnlichen Vorgang haben wir bereits im vorherigen Modul durchgeführt, als wir die Werte von X und Y übergeben haben. Jetzt müssen wir dasselbe tun, nur dass der Datentyp ein anderer ist und die Eingabefelder in einem modalen Fenster sind.

In der Datenbank werden die grundlegendsten Informationen über Länder gespeichert. Dies sind ihr Name (String type) und ihre allgemeine Beschreibung (Text). Dies sind die Eingabefelder, die Sie hinzufügen müssen.


Was this article helpful?
Suchen Sie immer noch nach einer Antwort?