Click here to view and discuss this page in DocCommentXchange. In the future, you will be sent there automatically.

SQL Anywhere 12.0.0 (Deutsch) » UltraLite - M-Business Anywhere-Programmierung » Praktische Einführung: Eine Beispielanwendung für M-Business Anywhere

 

Lektion 5: Datenmanipulation und Navigation hinzufügen

Diese Lektion beschreibt, wie Sie Ihrer Anwendung Datenmanipulations- und Navigationslogik hinzufügen.

 ♦  Die Tabelle initialisieren
  1. Initialisieren Sie CustomerTable, die die Customer-Tabelle in Ihrer Datenbank darstellt, indem Sie den folgenden Code am Ende der Connect-Funktion in tutorial.js hinzufügen:

    try {
      CustomerTable = Connection.getTable( "customer", null );
      CustomerTable.open();
    } catch( ex3 ) {
      alert("Error: " + ex3.getMessage() );
    }
  2. Fügen Sie Variablen hinzu, um Daten zwischen der Datenbank und dem Webformular auszutauschen.

    Fügen Sie die folgenden Variablendeklarationen am Anfang von tutorial.js für die customer-Daten hinzu:

    var GivenName = "";
    var Surname = "";
    var Street = "";
    var City = "";
    var Phone = "";
    var ID = "";
    
  3. Erstellen Sie Funktionen, um customer-Daten abzurufen und anzuzeigen.

    Fügen Sie tutorial.js die folgende Funktion hinzu: Diese Funktion ruft die aktuelle Zeile der customer-Daten ab und gewährleistet, dass NULL-Spalten als leere Zeichenfolgen dargestellt werden:



    function Fetch() 
    {
        if( CustomerTable.getRowCount() == 0 ) {
     GivenName = "";
     Surname = "";
     Street = "";
     City = "";
     Phone = "";
     ID = "";
     return;
        } 
        ID = CustomerTable.getString( CustomerTable.schema.getColumnID( "ID" ) );
        GivenName = CustomerTable.getString( CustomerTable.schema.getColumnID( "GivenName" ) );
        Surname = CustomerTable.getString( CustomerTable.schema.getColumnID( "Surname" ) );
        Street = CustomerTable.getString( CustomerTable.schema.getColumnID( "Street" ) );
        if( CustomerTable.isNull( CustomerTable.schema.getColumnID( "City" ) ) ) {
     City = "";
        } else {
     City = CustomerTable.getString( CustomerTable.schema.getColumnID( "City" ) );
        }
        if( CustomerTable.isNull( CustomerTable.schema.getColumnID( "Phone" ) ) ) {
     Phone = "";
        } else {
     Phone = CustomerTable.getString( CustomerTable.schema.getColumnID( "Phone" ) );
        }
    }
    

    Fügen Sie main.htm den folgenden Inhalt unmittelbar nach dem <script>-Tag hinzu: DisplayRow nimmt die Werte aus der Datenbank und zeigt sie im Webformular an. FetchForm nimmt die aktuellen Werte im Webformular und stellt sie dem Datenbankcode zur Verfügung.



    <script>
    function DisplayRow() {
        Fetch();
        document.form.ID.value = ID;
        document.form.GivenName.value = GivenName;
        document.form.Surname.value = Surname;
        document.form.Street.value = Street;
        document.form.City.value = City;
        document.form.Phone.value = Phone;
    }
    
    function FetchForm() {
        GivenName = document.form.GivenName.value;
        Surname = document.form.Surname.value;
        Street = document.form.Street.value;
        City = document.form.City.value;
        Phone = document.form.Phone.value;
    }
    </script>
  4. Rufen Sie DisplayRow auf, um die aktuelle Zeile anzuzeigen, wenn die Anwendung geladen wird. Ändern Sie das <body>-Tag am Anfang von main.htm folgendermaßen:

    <body onload="Connect(); DisplayRow();">

Auch wenn es noch keine Daten in der tutorial-Datenbank gibt, ist es ein guter Zeitpunkt, um den Kanal zu synchronisieren, damit sichergestellt wird, dass die Anwendung korrekt läuft.

 ♦  So fügen Sie Code zum Einfügen von Zeilen hinzu
  • Erstellen Sie Funktionen, um customer-Daten einzufügen.

    In der folgenden Prozedur versetzt der Aufruf von InsertBegin die Anwendung in den Einfügemodus und setzt alle Werte in der aktuellen Zeile auf ihre Standardwerte. Die ID-Spalte erhält beispielsweise den nächsten Autoincrement-Wert. Die Spaltenwerte werden festgelegt, und die nächste Zeile wird eingefügt.

    Fügen Sie tutorial.js die folgende Funktion hinzu:



    function Insert()
    {
        try {
     CustomerTable.insertBegin();
     CustomerTable.setString( CustomerTable.schema.getColumnID( "GivenName" ), GivenName );
     CustomerTable.setString( CustomerTable.schema.getColumnID( "Surname" ), Surname );
     CustomerTable.setString( CustomerTable.schema.getColumnID( "Street" ), Street );
     if( City.length > 0 ) {
         CustomerTable.setString( CustomerTable.schema.getColumnID( "City" ), City );
     }
     if( Phone.length > 0 ) {
         CustomerTable.setString( CustomerTable.schema.getColumnID( "Phone" ), Phone );
     }
     CustomerTable.insert();
     CustomerTable.moveLast();
        } catch( ex ) {
     alert( "Error: cannot insert row: " + ex.getMessage() );
        }
    }

    Fügen Sie main.htm die folgende Funktion hinzu:

    function ClickInsert()
    {
        FetchForm();
        Insert();
        DisplayRow();
    }