Einführung in das Arbeiten mit einer Datenbank in ASP.NET Webseiten (Razor)-Websites

von Tom FitzMacken

In diesem Artikel wird beschrieben, wie Sie microsoft WebMatrix-Tools zum Erstellen einer Datenbank auf einer ASP.NET Webseite (Razor) verwenden und wie Sie Seiten erstellen, mit denen Sie Daten anzeigen, hinzufügen, bearbeiten und löschen können.

Was Sie lernen:

• Erstellen einer Datenbank
• So stellen Sie eine Verbindung mit einer Datenbank her.
• So zeigen Sie Daten auf einer Webseite an.
• Einfügen, Aktualisieren und Löschen von Datenbankdatensätzen

Dies sind die features, die im Artikel eingeführt wurden:

• Arbeiten mit einer Microsoft SQL Server Compact Edition-Datenbank.
• Arbeiten mit SQL-Abfragen.
• Die Database Klasse.

Im Lernprogramm verwendete Softwareversionen

• ASP.NET Webseiten (Razor) 2
• WebMatrix 2

Dieses Lernprogramm funktioniert auch mit WebMatrix 3. Sie können ASP.NET Webseiten 3 und Visual Studio 2013 (oder Visual Studio Express 2013 für Web) verwenden; Die Benutzeroberfläche unterscheidet sich jedoch.

Einführung in Datenbanken

Stellen Sie sich ein typisches Adressbuch vor. Für jeden Eintrag im Adressbuch (d. h. für jede Person) gibt es mehrere Informationen wie Vorname, Nachname, Adresse, E-Mail-Adresse und Telefonnummer.

Eine typische Möglichkeit zum Bilden von Daten wie dieser ist eine Tabelle mit Zeilen und Spalten. In Datenbankbegriffen wird jede Zeile häufig als Datensatz bezeichnet. Jede Spalte (manchmal als Felder bezeichnet) enthält einen Wert für jeden Datentyp: Vorname, Nachname usw.

Für die meisten Datenbanktabellen muss die Tabelle über eine Spalte verfügen, die einen eindeutigen Bezeichner enthält, z. B. eine Kundennummer, kontonummer usw. Dies wird als Primärschlüssel der Tabelle bezeichnet, und Sie verwenden ihn, um jede Zeile in der Tabelle zu identifizieren. Im Beispiel ist die ID-Spalte der Primärschlüssel für das Adressbuch.

Mit diesem grundlegenden Verständnis von Datenbanken können Sie lernen, wie Sie eine einfache Datenbank erstellen und Vorgänge wie Hinzufügen, Ändern und Löschen von Daten ausführen.

Erstellen einer Datenbank

In diesem Verfahren wird gezeigt, wie Sie eine Datenbank mit dem Namen SmallBakery mithilfe des SQL Server Compact-Datenbankentwurfstools erstellen, das in WebMatrix enthalten ist. Obwohl Sie eine Datenbank mit Code erstellen können, ist es typischer, die Datenbank- und Datenbanktabellen mithilfe eines Entwurfstools wie WebMatrix zu erstellen.

1. Starten Sie WebMatrix, und klicken Sie auf der Schnellstartseite auf "Website aus Vorlage".

2. Wählen Sie "Leere Website" aus, und geben Sie im Feld "Websitename " "SmallBakery" ein, und klicken Sie dann auf "OK". Die Website wird in WebMatrix erstellt und angezeigt.

3. Klicken Sie im linken Bereich auf den Arbeitsbereich "Datenbanken ".

4. Klicken Sie im Menüband auf "Neue Datenbank". Eine leere Datenbank wird mit demselben Namen wie Ihre Website erstellt.

5. Erweitern Sie im linken Bereich den Knoten SmallBakery.sdf , und klicken Sie dann auf "Tabellen".

6. Klicken Sie im Menüband auf "Neue Tabelle". WebMatrix öffnet den Tabellen-Designer.

   

7. Klicken Sie in die Spalte "Name ", und geben Sie "ID" ein.

8. Wählen Sie in der Spalte "Datentyp " die Option "int" aus.

9. Setzen Sie die Optionen Primärschlüssel? und Identifizieren? auf Ja.

   Wie der Name bereits sagt, teilt Is Primary Key der Datenbank mit, dass dies der Primärschlüssel der Tabelle ist. Is Identity weist die Datenbank an, automatisch eine ID-Nummer für jeden neuen Datensatz zu erstellen und sie der nächsten sequenziellen Zahl (beginnend bei 1) zuzuweisen.

10. Klicken Sie in die nächste Zeile. Der Editor startet eine neue Spaltendefinition.

11. Geben Sie für den Namenwert "Name" ein.

12. Wählen Sie für Datentyp "nvarchar" aus, und legen Sie die Länge auf 50 fest. Der Var-Teil der nvarchar Datenbank teilt der Datenbank mit, dass die Daten für diese Spalte eine Zeichenfolge sind, deren Größe von Datensatz zu Datensatz variieren kann. (Das Präfix n stellt national dar und gibt an, dass das Feld Zeichendaten enthalten kann, die ein beliebiges Alphabet- oder Schreibsystem darstellen, d. h., dass das Feld Unicode-Daten enthält.)

13. Legen Sie die Option "Null zulassen " auf "Nein" fest. Dadurch wird erzwungen, dass die Spalte "Name " nicht leer bleibt.

14. Erstellen Sie mit diesem Vorgang eine Spalte mit dem Namen "Beschreibung". Legen Sie den Datentyp auf "nvarchar" und 50 für die Länge fest, und legen Sie "Nullen zulassen" auf "false" fest.

15. Erstellen Sie eine Spalte mit dem Namen "Preis". Legen Sie den Datentyp auf "Money" fest, und legen Sie "Nullen zulassen" auf "false" fest.

16. Benennen Sie in dem Feld oben die Tabelle "Produkt".

    Wenn Sie fertig sind, sieht die Definition wie folgt aus:

    

17. Drücken Sie STRG+S, um die Tabelle zu speichern.

Hinzufügen von Daten zur Datenbank

Jetzt können Sie Ihrer Datenbank einige Beispieldaten hinzufügen, mit denen Sie später im Artikel arbeiten werden.

1. Erweitern Sie im linken Bereich den Knoten SmallBakery.sdf , und klicken Sie dann auf "Tabellen".

2. Klicken Sie mit der rechten Maustaste auf die Produkttabelle, und klicken Sie dann auf "Daten".

3. Geben Sie im Bearbeitungsbereich die folgenden Datensätze ein:

   Name	Beschreibung	Preis
   Brot	Täglich frisch gebacken.	2,99
   Erdbeerkuchen	Hergestellt mit Bio-Erdbeeren aus unserem Garten.	9.99
   Apfelkuchen	Zweitens nur nach dem Kuchen deiner Mutter.	12.99
   Pecan Pie	Wenn Sie Pecans mögen, ist dies für Sie.	10,99
   Zitronenkuchen	Hergestellt mit den besten Zitronen der Welt.	11,99
   Cupcakes	Ihre Kinder und das Kind in Ihnen werden diese lieben.	7,99

   Denken Sie daran, dass Sie nichts für die ID-Spalte eingeben müssen. Wenn Sie die Id-Spalte erstellt haben, legen Sie die Is Identity-Eigenschaft auf "true" fest, wodurch sie automatisch ausgefüllt wird.

   Wenn Sie mit der Eingabe der Daten fertig sind, sieht der Tabellen-Designer wie folgt aus:

   

4. Schließen Sie die Registerkarte, die die Datenbankdaten enthält.

Anzeigen von Daten aus einer Datenbank

Nachdem Sie über eine Datenbank mit darin gespeicherten Daten verfügen, können Sie die Daten auf einer ASP.NET Webseite anzeigen. Um die anzuzeigenden Tabellenzeilen auszuwählen, verwenden Sie eine SQL-Anweisung, bei der es sich um einen Befehl handelt, den Sie an die Datenbank übergeben.

1. Klicken Sie im linken Bereich auf den Arbeitsbereich "Dateien ".

2. Erstellen Sie im Stamm der Website eine neue CSHTML-Seite namens ListProducts.cshtml.

3. Ersetzen Sie das vorhandene Markup durch Folgendes:

   @{
       var db = Database.Open("SmallBakery");
       var selectQueryString = "SELECT * FROM Product ORDER BY Name";
    }
   <!DOCTYPE html>
   <html>
    <head>
      <title>Small Bakery Products</title>
      <style>
          table, th, td {
            border: solid 1px #bbbbbb;
            border-collapse: collapse;
            padding: 2px;
          }
       </style>
    </head>
    <body>
      <h1>Small Bakery Products</h1>
      <table>
          <thead>
              <tr>
                  <th>Id</th>
                  <th>Product</th>
                  <th>Description</th>
          <th>Price</th>
              </tr>
          </thead>
          <tbody>
              @foreach(var row in db.Query(selectQueryString)){
               <tr>
                  <td>@row.Id</td>
                      <td>@row.Name</td>
                      <td>@row.Description</td>
                      <td>@row.Price</td>
               </tr>
              }
          </tbody>
      </table>
    </body>
   </html>
   

   Öffnen Sie im ersten Codeblock die Datei SmallBakery.sdf (Datenbank), die Sie zuvor erstellt haben. Bei der Database.Open Methode wird davon ausgegangen, dass sich die SDF-Datei im App_Data Ordner Ihrer Website befindet. (Beachten Sie, dass Sie die SDF-Erweiterung nicht angeben müssen – wenn Sie dies tun, funktioniert die Open Methode nicht.)

   Hinweis

   Der ordner App_Data ist ein spezieller Ordner in ASP.NET, der zum Speichern von Datendateien verwendet wird. Weitere Informationen finden Sie unter Herstellen einer Verbindung mit einer Datenbank weiter unten in diesem Artikel.

   Anschließend stellen Sie eine Anforderung zum Abfragen der Datenbank mithilfe der folgenden SQL-Anweisung Select vor:

   SELECT * FROM Product ORDER BY Name
   

   In der Aussage identifiziert Product die abzufragende Tabelle. Das * Zeichen gibt an, dass die Abfrage alle Spalten aus der Tabelle zurückgeben soll. (Sie können auch Spalten einzeln auflisten, getrennt durch Kommas, wenn nur einige der Spalten angezeigt werden sollen.) Die Order By Klausel gibt an, wie die Daten sortiert werden sollen – in diesem Fall nach der Spalte "Name ". Dies bedeutet, dass die Daten alphabetisch nach dem Wert der Spalte "Name " für jede Zeile sortiert werden.

   Im Textkörper der Seite erstellt das Markup eine HTML-Tabelle, die zum Anzeigen der Daten verwendet wird. Innerhalb des <tbody> Elements verwenden Sie eine foreach Schleife, um jede Datenzeile, die von der Abfrage zurückgegeben wird, einzeln abzurufen. Für jede Datenzeile erstellen Sie eine HTML-Tabellenzeile (<tr> Element). Anschließend erstellen Sie HTML-Tabellenzellen (<td> Elemente) für jede Spalte. Jedes Mal, wenn Sie die Schleife durchlaufen, befindet sich die nächste verfügbare Zeile aus der Datenbank in der row Variablen (Sie richten dies in der foreach Anweisung ein). Um eine einzelne Spalte aus der Zeile zu erhalten, können Sie row.Name oder row.Description oder den Namen der gewünschten Spalte verwenden.

4. Führen Sie die Seite in einem Browser aus. (Stellen Sie sicher, dass die Seite im Arbeitsbereich "Dateien " ausgewählt ist, bevor Sie sie ausführen.) Auf der Seite wird eine Liste wie folgt angezeigt:

   

Einfügen von Daten in eine Datenbank

In diesem Abschnitt wird gezeigt, wie Sie eine Seite erstellen, auf der Benutzer der Datenbanktabelle " Produkt " ein neues Produkt hinzufügen können. Nachdem ein neuer Produktdatensatz eingefügt wurde, zeigt die Seite die aktualisierte Tabelle mithilfe der Seite ListProducts.cshtml an, die Sie im vorherigen Abschnitt erstellt haben.

Die Seite enthält eine Überprüfung, um sicherzustellen, dass die vom Benutzer eingegebenen Daten für die Datenbank gültig sind. Code auf der Seite stellt beispielsweise sicher, dass für alle erforderlichen Spalten ein Wert eingegeben wurde.

1. Erstellen Sie auf der Website eine neue CSHTML-Datei namens InsertProducts.cshtml.

2. Ersetzen Sie das vorhandene Markup durch Folgendes:

   @{
       Validation.RequireField("Name", "Product name is required.");
       Validation.RequireField("Description", "Product description is required.");
       Validation.RequireField("Price", "Product price is required.");
   
       var db = Database.Open("SmallBakery");
       var Name = Request.Form["Name"];
       var Description = Request.Form["Description"];
       var Price = Request.Form["Price"];
   
       if (IsPost && Validation.IsValid()) {
           // Define the insert query. The values to assign to the
           // columns in the Product table are defined as parameters
           // with the VALUES keyword.
           if(ModelState.IsValid) {
               var insertQuery = "INSERT INTO Product (Name, Description, Price) " +
                   "VALUES (@0, @1, @2)";
               db.Execute(insertQuery, Name, Description, Price);
               // Display the page that lists products.
               Response.Redirect("~/ListProducts");
           }
       }
   }
   
   <!DOCTYPE html>
   <html>
   <head>
    <title>Add Products</title>
    <style type="text/css">
       label {float:left; width: 8em; text-align: right;
              margin-right: 0.5em;}
       fieldset {padding: 1em; border: 1px solid; width: 50em;}
       legend {padding: 2px 4px; border: 1px solid; font-weight:bold;}
       .validation-summary-errors {font-weight:bold; color:red;
              font-size: 11pt;}
    </style>
   </head>
   <body>
    <h1>Add New Product</h1>
   
    @Html.ValidationSummary("Errors with your submission:")
   
    <form method="post" action="">
      <fieldset>
        <legend>Add Product</legend>
        <div>
          <label>Name:</label>
          <input name="Name" type="text" size="50" value="@Name" />
        </div>
        <div>
          <label>Description:</label>
          <input name="Description" type="text" size="50"
              value="@Description" />
        </div>
        <div>
          <label>Price:</label>
          <input name="Price" type="text" size="50" value="@Price" />
        </div>
        <div>
          <label>&nbsp;</label>
          <input type="submit" value="Insert" class="submit" />
        </div>
      </fieldset>
    </form>
   </body>
   </html>
   

   Der Textkörper der Seite enthält ein HTML-Formular mit drei Textfeldern, mit denen Benutzer einen Namen, eine Beschreibung und einen Preis eingeben können. Wenn Benutzer auf die Schaltfläche "Einfügen " klicken, öffnet der Code oben auf der Seite eine Verbindung mit der SmallBakery.sdf-Datenbank . Anschließend rufen Sie die Werte ab, die der Benutzer mithilfe des Request Objekts übermittelt hat, und weisen diese Werte lokalen Variablen zu.

   Um zu überprüfen, ob der Benutzer einen Wert für jede erforderliche Spalte eingegeben hat, registrieren Sie jedes <input> Element, das Sie überprüfen möchten:

   Validation.RequireField("Name", "Product name is required.");
   Validation.RequireField("Description", "Product description is required.");
   Validation.RequireField("Price", "Product price is required.");
   

   Die Validation Hilfsfunktion überprüft, ob in jedem der Felder, die Sie registriert haben, ein Wert vorhanden ist. Sie können testen, ob alle Felder die Validierung bestanden haben, indem Sie Validation.IsValid() überprüfen. Dies tun Sie normalerweise, bevor Sie die Informationen verarbeiten, die Sie vom Benutzer erhalten haben.

   if (IsPost && Validation.IsValid()) {
       // Process information here
   }
   

   (Der && Operator bedeutet UND – dieser Test ist Wenn es sich um eine Formularübermittlung handelt UND alle Felder die Überprüfung bestanden haben.)

   Wenn alle überprüften Spalten (keine leer) sind, erstellen Sie eine SQL-Anweisung, um die Daten einzufügen, und führen Sie sie dann wie folgt aus:

   var insertQuery =
       "INSERT INTO Product (Name, Description, Price) VALUES (@0, @1, @2)";
   

   Für die einzufügenden Werte schließen Sie Parameterplatzhalter (@0, , @1@2) ein.

   Hinweis

   Als Sicherheitsvorkehrung übergeben Sie immer Werte mithilfe von Parametern an eine SQL-Anweisung, wie im vorherigen Beispiel zu sehen. Auf diese Weise erhalten Sie die Möglichkeit, die Daten des Benutzers zu überprüfen. Außerdem können Sie vor Versuchen schützen, bösartige Befehle an Ihre Datenbank zu senden (manchmal auch als SQL-Einfügungsangriffe bezeichnet).

   Um die Abfrage auszuführen, verwenden Sie diese Anweisung und übergeben ihr die Variablen, die die Werte enthalten, um die Platzhalter zu ersetzen.

   db.Execute(insertQuery, Name, Description, Price);
   

   Nachdem die Insert Into Anweisung ausgeführt wurde, senden Sie den Benutzer an die Seite, auf der die Produkte in dieser Zeile aufgelistet sind:

   Response.Redirect("~/ListProducts");
   

   Wenn die Überprüfung nicht erfolgreich war, überspringen Sie das Einfügen. Stattdessen haben Sie ein Hilfsprogramm auf der Seite, auf dem die gesammelten Fehlermeldungen angezeigt werden (falls vorhanden):

   @Html.ValidationSummary("Errors with your submission:")
   

   Beachten Sie, dass der Formatvorlagenblock im Markup eine CSS-Klassendefinition mit dem Namen .validation-summary-errorsenthält. Dies ist der Name der CSS-Klasse, die standardmäßig für das <div> Element verwendet wird, das Überprüfungsfehler enthält. In diesem Fall gibt die CSS-Klasse an, dass Validierungszusammenfassungsfehler rot und fett angezeigt werden, aber Sie können die .validation-summary-errors Klasse definieren, um beliebige Formatierungen anzuzeigen.

Test der Einfügen-Seite

1. Zeigen Sie die Seite in einem Browser an. Auf der Seite wird ein Formular angezeigt, das dem in der folgenden Abbildung gezeigten Formular ähnelt.

   

2. Geben Sie Werte für alle Spalten ein, stellen Sie jedoch sicher, dass Sie die Spalte "Preis " leer lassen.

3. Klicken Sie auf Einfügen. Auf der Seite wird eine Fehlermeldung angezeigt, wie in der folgenden Abbildung dargestellt. (Es wird kein neuer Datensatz erstellt.)

   

4. Füllen Sie das Formular vollständig aus, und klicken Sie dann auf "Einfügen". Diesmal wird die Seite ListProducts.cshtml angezeigt und zeigt den neuen Datensatz an.

Aktualisieren von Daten in einer Datenbank

Nachdem Daten in eine Tabelle eingegeben wurden, müssen Sie sie möglicherweise aktualisieren. In diesem Verfahren wird gezeigt, wie Sie zwei Seiten erstellen, die denen ähneln, die Sie zuvor für die Dateneinfügung erstellt haben. Auf der ersten Seite werden Produkte angezeigt, und Benutzer können eines auswählen, um es zu ändern. Auf der zweiten Seite können die Benutzer die Bearbeitungen tatsächlich vornehmen und speichern.

1. Erstellen Sie auf der Website eine neue CSHTML-Datei namens EditProducts.cshtml.

2. Ersetzen Sie das vorhandene Markup in der Datei durch Folgendes:

   @{
       var db = Database.Open("SmallBakery");
       var selectQueryString = "SELECT * FROM Product ORDER BY Name";
   
   }
   <!DOCTYPE html>
   <html>
   <head>
       <title>Edit Products</title>
       <style type="text/css">
           table, th, td {
             border: solid 1px #bbbbbb;
             border-collapse: collapse;
             padding: 2px;
           }
       </style>
   </head>
   <body>
       <h1>Edit Small Bakery Products</h1>
       <table>
         <thead>
           <tr>
             <th>&nbsp;</th>
             <th>Name</th>
             <th>Description</th>
             <th>Price</th>
           </tr>
         </thead>
         <tbody>
           @foreach (var row in db.Query(selectQueryString)) {
             <tr>
               <td><a href="@Href("~/UpdateProducts", row.Id)">Edit</a></td>
               <td>@row.Name</td>
               <td>@row.Description</td>
               <td>@row.Price</td>
             </tr>
           }
         </tbody>
       </table>
   </body>
   </html>
   

   Der einzige Unterschied zwischen dieser Seite und der Seite ListProducts.cshtml von früher ist, dass die HTML-Tabelle auf dieser Seite eine zusätzliche Spalte enthält, in der ein Link zum Bearbeiten angezeigt wird. Wenn Sie auf diesen Link klicken, gelangen Sie zur Seite "UpdateProducts.cshtml " (die Sie als Nächstes erstellen), auf der Sie den ausgewählten Datensatz bearbeiten können.

   Sehen Sie sich den Code an, der den Link "Bearbeiten" erstellt:

   <a href="@Href("~/UpdateProducts", row.Id)">Edit</a></td>
   

   Dadurch wird ein HTML-Element <a> erstellt, dessen href Attribut dynamisch festgelegt wird. Das href Attribut gibt die Seite an, die angezeigt werden soll, wenn der Benutzer auf den Link klickt. Außerdem wird der Id Wert der aktuellen Zeile an die Verknüpfung übergeben. Wenn die Seite ausgeführt wird, enthält die Seitenquelle möglicherweise Links wie die folgenden:

   <a href="UpdateProducts/1">Edit</a></td>
   <a href="UpdateProducts/2">Edit</a></td>
   <a href="UpdateProducts/3">Edit</a></td>
   

   Beachten Sie, dass das href Attribut auf UpdateProducts/n"n" festgelegt ist, wobei n eine Produktnummer ist. Wenn ein Benutzer auf einen dieser Links klickt, sieht die resultierende URL ungefähr wie folgt aus:

   http://localhost:18816/UpdateProducts/6

   Mit anderen Worten, die zu bearbeitende Produktnummer wird in der URL übergeben.

3. Zeigen Sie die Seite in einem Browser an. Auf der Seite werden die Daten in einem Format wie folgt angezeigt:

   

   Als Nächstes erstellen Sie die Seite, auf der Benutzer die Daten tatsächlich aktualisieren können. Die Aktualisierungsseite enthält eine Überprüfung, um die vom Benutzer eingegebenen Daten zu überprüfen. Code auf der Seite stellt beispielsweise sicher, dass für alle erforderlichen Spalten ein Wert eingegeben wurde.

4. Erstellen Sie auf der Website eine neue CSHTML-Datei namens "UpdateProducts.cshtml".

5. Ersetzen Sie das vorhandene Markup in der Datei durch Folgendes.

   @{
       Validation.RequireField("Name", "Product name is required.");
       Validation.RequireField("Description", "Product description is required.");
       Validation.RequireField("Price", "Product price is required.");
   
       var Name = "";
       var Description = "";
       var Price = Decimal.Zero;
   
       var ProductId  = UrlData[0];
       if (ProductId.IsEmpty()) {
            Response.Redirect("~/EditProducts");
       }
   
       var db = Database.Open("SmallBakery");
   
       if (IsPost && Validation.IsValid()) {
           var updateQueryString =
               "UPDATE Product SET Name=@0, Description=@1, Price=@2 WHERE Id=@3" ;
           Name = Request["Name"];
           Description = Request["Description"];
           Price = Request["Price"].AsDecimal();
           db.Execute(updateQueryString, Name, Description, Price, ProductId);
           Response.Redirect(@Href("~/EditProducts"));
       }
       else {
           var selectQueryString = "SELECT * FROM Product WHERE Id=@0";
   
           var row = db.QuerySingle(selectQueryString, ProductId);
           Name = row.Name;
           Description = row.Description;
           Price = row.Price;
       }
   
   }
   
   <!DOCTYPE html>
   <html>
   <head>
     <title>Add Products</title>
     <style type="text/css">
        label { float: left; width: 8em; text-align: right;
                margin-right: 0.5em;}
        fieldset { padding: 1em; border: 1px solid; width: 35em;}
        legend { padding: 2px 4px;  border: 1px solid; font-weight: bold;}
        .validation-summary-errors {font-weight:bold; color:red; font-size:11pt;}
     </style>
   </head>
   <body>
     <h1>Update Product</h1>
      @Html.ValidationSummary("Errors with your submission:")
      <form method="post" action="">
        <fieldset>
          <legend>Update Product</legend>
          <div>
            <label>Name:</label>
            <input name="Name" type="text" size="50" value="@Name" />
          </div>
          <div>
            <label>Description:</label>
            <input name="Description" type="text" size="50"
               value="@Description" />
          </div>
          <div>
             <label>Price:</label>
             <input name="Price" type="text" size="50" value="@Price" />
          </div>
          <div>
             <label>&nbsp;</label>
             <input type="submit" value="Update" class="submit" />
          </div>
       </fieldset>
     </form>
   </body>
   </html>
   

   Der Textkörper der Seite enthält ein HTML-Formular, in dem ein Produkt angezeigt wird und wo Benutzer es bearbeiten können. Um das anzuzeigende Produkt abzurufen, verwenden Sie diese SQL-Anweisung:

   SELECT * FROM Product WHERE Id=@0
   

   Dadurch wird das Produkt ausgewählt, dessen ID dem Wert entspricht, der im Parameter @0 übergeben wird. (Da die ID der Primärschlüssel ist und daher eindeutig sein muss, kann auf diese Weise nur ein Produktdatensatz ausgewählt werden.) Um den ID-Wert abzurufen, der an diese Select Anweisung übergeben werden soll, können Sie den Wert lesen, der als Teil der URL an die Seite übergeben wird, indem Sie die folgende Syntax verwenden:

   var ProductId  = UrlData[0];
   

   Um den Produktdatensatz tatsächlich abzurufen, verwenden Sie die QuerySingle Methode, die nur einen Datensatz zurückgibt:

   var row = db.QuerySingle(selectQueryString, ProductId);
   

   Die einzelne Zeile wird in die row Variable zurückgegeben. Sie können Daten aus jeder Spalte abrufen und sie lokalen Variablen wie den folgenden zuweisen:

   var Name = row.Name;
   var Description = row.Description;
   var Price = row.Price;
   

   Im Markup für das Formular werden diese Werte automatisch in einzelnen Textfeldern mithilfe von eingebetteten Code wie den folgenden angezeigt:

   <input name="Name" type="text" size="50" value="@Name" />
   

   Dieser Teil des Codes zeigt den zu aktualisierenden Produktdatensatz an. Nachdem der Datensatz angezeigt wurde, kann der Benutzer einzelne Spalten bearbeiten.

   Wenn der Benutzer das Formular durch Klicken auf die Schaltfläche "Aktualisieren " sendet, wird der Code im if(IsPost) Block ausgeführt. Dadurch werden die Werte des Benutzers aus dem Request Objekt abgerufen, die Werte in Variablen gespeichert und überprüft, ob jede Spalte ausgefüllt wurde. Wenn die Überprüfung erfolgreich ist, erstellt der Code die folgende SQL Update-Anweisung:

   UPDATE Product SET Name=@0, Description=@1, Price=@2, WHERE ID=@3
   

   In einer SQL-Anweisung Update geben Sie jede zu aktualisierende Spalte und den Wert an, auf den sie festgelegt werden soll. In diesem Code werden die Werte mithilfe der Parameterplatzhalter @0, @1, , @2usw. angegeben. (Wie bereits erwähnt, sollten Sie Werte immer Mithilfe von Parametern an eine SQL-Anweisung übergeben.)

   Wenn Sie die db.Execute Methode aufrufen, übergeben Sie die Variablen, die die Werte in der Reihenfolge enthalten, die den Parametern in der SQL-Anweisung entspricht:

   db.Execute(updateQueryString, Name, Description, Price, ProductId);
   

   Nachdem die Update Anweisung ausgeführt wurde, rufen Sie die folgende Methode auf, um den Benutzer zurück zur Bearbeitungsseite umzuleiten:

   Response.Redirect(@Href("~/EditProducts"));
   

   Der Effekt ist, dass der Benutzer eine aktualisierte Auflistung der Daten in der Datenbank sieht und ein anderes Produkt bearbeiten kann.

6. Speichern Sie die Seite.

7. Führen Sie die EditProducts.cshtml-Seite (nicht die Aktualisierungsseite) aus, und klicken Sie dann auf "Bearbeiten ", um ein zu bearbeitenes Produkt auszuwählen. Die Seite "UpdateProducts.cshtml" wird angezeigt und zeigt den ausgewählten Datensatz an.

   

8. Nehmen Sie eine Änderung vor, und klicken Sie auf "Aktualisieren". Die Produktliste wird erneut mit den aktualisierten Daten angezeigt.

Löschen von Daten in einer Datenbank

In diesem Abschnitt wird gezeigt, wie Benutzer ein Produkt aus der Tabelle "Produktdatenbank " löschen können. Das Beispiel besteht aus zwei Seiten. Auf der ersten Seite wählen Benutzer einen zu löschenden Datensatz aus. Der zu löschende Datensatz wird dann auf einer zweiten Seite angezeigt, mit der er bestätigen kann, dass er den Datensatz löschen möchte.

1. Erstellen Sie auf der Website eine neue CSHTML-Datei namens ListProductsForDelete.cshtml.

2. Ersetzen Sie das vorhandene Markup durch Folgendes:

   @{
     var db = Database.Open("SmallBakery");
     var selectQueryString = "SELECT * FROM Product ORDER BY Name";
   }
   <!DOCTYPE html>
   <html>
   <head>
       <title>Delete a Product</title>
       <style>
           table, th, td {
             border: solid 1px #bbbbbb;
             border-collapse: collapse;
             padding: 2px;
           }
        </style>
   </head>
   <body>
     <h1>Delete a Product</h1>
     <form method="post" action="" name="form">
       <table border="1">
         <thead>
           <tr>
             <th>&nbsp;</th>
             <th>Name</th>
             <th>Description</th>
             <th>Price</th>
           </tr>
         </thead>
         <tbody>
           @foreach (var row in db.Query(selectQueryString)) {
             <tr>
               <td><a href="@Href("~/DeleteProduct", row.Id)">Delete</a></td>
               <td>@row.Name</td>
               <td>@row.Description</td>
               <td>@row.Price</td>
             </tr>
           }
         </tbody>
       </table>
     </form>
   </body>
   </html>
   

   Diese Seite ähnelt der EditProducts.cshtml-Seite aus früheren Versionen. Anstelle eines Bearbeitungslinks für jedes Produkt wird jedoch ein Link zum Löschen angezeigt. Der Link " Löschen " wird mithilfe des folgenden eingebetteten Codes im Markup erstellt:

   <a href="@Href("~/DeleteProduct", row.Id)">Delete</a>
   

   Dadurch wird eine URL erstellt, die wie folgt aussieht, wenn Benutzer auf den Link klicken:

   http://<server>/DeleteProduct/4

   Die URL ruft eine Seite namens DeleteProduct.cshtml (die Sie als Nächstes erstellen) auf und übergibt sie an die ID des zu löschenden Produkts (hier, 4).

3. Speichern Sie die Datei, lassen Sie sie aber geöffnet.

4. Erstellen Sie eine weitere CHTML-Datei namens DeleteProduct.cshtml. Ersetzen Sie den vorhandenen Inhalt durch Folgendes:

   @{
     var db = Database.Open("SmallBakery");
     var ProductId = UrlData[0];
     if (ProductId.IsEmpty()) {
       Response.Redirect("~/ListProductsForDelete");
     }
     var prod = db.QuerySingle("SELECT * FROM PRODUCT WHERE ID = @0", ProductId);
     if( IsPost && !ProductId.IsEmpty()) {
       var deleteQueryString = "DELETE FROM Product WHERE Id=@0";
       db.Execute(deleteQueryString, ProductId);
       Response.Redirect("~/ListProductsForDelete");
     }
   }
   
   <!DOCTYPE html>
   <html>
   <head>
       <title>Delete Product</title>
   </head>
   <body>
     <h1>Delete Product - Confirmation</h1>
     <form method="post" action="" name="form">
       <p>Are you sure you want to delete the following product?</p>
   
       <p>Name: @prod.Name <br />
          Description: @prod.Description <br />
          Price: @prod.Price</p>
       <p><input type="submit" value="Delete" /></p>
     </form>
   </body>
   </html>
   

   Diese Seite wird von ListProductsForDelete.cshtml aufgerufen und ermöglicht Benutzern zu bestätigen, dass sie ein Produkt löschen möchten. Um das zu löschende Produkt auflisten zu können, erhalten Sie die ID des Produkts, das mit dem folgenden Code aus der URL gelöscht werden soll:

   var ProductId = UrlData[0];
   

   Die Seite fordert den Benutzer dann auf, auf eine Schaltfläche zu klicken, um den Datensatz tatsächlich zu löschen. Dies ist eine wichtige Sicherheitsmaßnahme: Wenn Sie vertrauliche Vorgänge in Ihrer Website ausführen, z. B. Daten aktualisieren oder löschen, sollten diese Vorgänge immer mit einem POST-Vorgang und keine GET-Operation durchgeführt werden. Wenn Ihre Website so konfiguriert ist, dass ein Löschvorgang mithilfe einer GET-Anfrage durchgeführt werden kann, kann jeder eine URL übergeben und alles von Ihrer Datenbank löschen, was er möchte. Indem Sie die Bestätigung hinzufügen und die Seite codieren, sodass das Löschen nur mithilfe eines POST ausgeführt werden kann, fügen Sie Ihrer Website ein Maß an Sicherheit hinzu.

   Der eigentliche Löschvorgang wird mit dem folgenden Code ausgeführt, der zunächst bestätigt, dass es sich um einen Postvorgang handelt und dass die ID nicht leer ist:

   if( IsPost && !ProductId.IsEmpty()) {
       var deleteQueryString = "DELETE FROM Product WHERE Id=@0";
       db.Execute(deleteQueryString, ProductId);
       Response.Redirect("~/ListProductsForDelete");
   }
   

   Der Code führt eine SQL-Anweisung aus, die den angegebenen Datensatz löscht, und leitet den Benutzer dann zurück zur Eintragsseite.

5. Führen Sie ListProductsForDelete.cshtml in einem Browser aus.

   

6. Klicken Sie auf den Link "Löschen " für eines der Produkte. Die DeleteProduct.cshtml-Seite wird angezeigt, um zu bestätigen, dass Sie diesen Datensatz löschen möchten.

7. Klicken Sie auf die Schaltfläche Löschen . Der Produktdatensatz wird gelöscht, und die Seite wird mit einem aktualisierten Produkteintrag aktualisiert.

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
  <connectionStrings>
   <add
     name="SQLServerConnectionString"
     connectionString= "server=myServer;database=myDatabase;uid=username;$CREDENTIAL_PLACEHOLDER$"
     providerName="System.Data.SqlClient" />
  </connectionStrings>
</configuration>

@{
    var db = Database.Open("SQLServerConnectionString");
}

Zusätzliche Ressourcen

• SQL Server Kompakt
• Herstellen einer Verbindung mit einer SQL Server- oder MySQL-Datenbank in WebMatrix
• Überprüfen der Benutzereingabe in ASP.NET Web Pages-Websites