Hinzufügen einer Create-Methode und -Ansicht

von Scott Hanselman

Dies ist ein Anfängertutorial, in dem die Grundlagen der ASP.NET MVC vorgestellt werden. Sie erstellen eine einfache Webanwendung, die Lese- und Schreibvorgänge aus einer Datenbank ermöglicht. Besuchen Sie das ASP.NET MVC Learning Center , um weitere ASP.NET MVC-Tutorials und -Beispiele zu finden.

In diesem Abschnitt implementieren wir die erforderliche Unterstützung, damit Benutzer neue Filme in unserer Datenbank erstellen können. Dazu implementieren wir die Aktion /Movies/Create URL.

Die Implementierung der /Movies/Create-URL ist ein zweistufiger Prozess. Wenn ein Benutzer die /Movies/Create-URL zum ersten Mal besucht, möchten wir ihnen ein HTML-Formular anzeigen, das er ausfüllen kann, um einen neuen Film einzugeben. Wenn der Benutzer dann das Formular übermittelt und die Daten zurück an den Server sendet, möchten wir die bereitgestellten Inhalte abrufen und in unserer Datenbank speichern.

Wir implementieren diese beiden Schritte innerhalb von zwei Create()-Methoden innerhalb unserer MoviesController-Klasse. Eine Methode zeigt das <Formular> an, das der Benutzer ausfüllen soll, um einen neuen Film zu erstellen. Die zweite Methode verarbeitet die bereitgestellten Daten, wenn der Benutzer das <Formular> zurück an den Server sendet, und speichert einen neuen Film in unserer Datenbank.

Im Folgenden finden Sie den Code, den wir unserer MoviesController-Klasse hinzufügen, um dies zu implementieren:

public ActionResult Create()
{
    return View();
}

[HttpPost]
public ActionResult Create(Movie newMovie)
{

    if (ModelState.IsValid)
    {
        db.AddToMovies(newMovie);
        db.SaveChanges();

        return RedirectToAction("Index");
    }
    else
    {
        return View(newMovie);
    }
}

Der obige Code enthält den gesamten Code, den wir in unserem Controller benötigen.

Jetzt implementieren wir die Vorlage Ansicht erstellen, die wir verwenden, um dem Benutzer ein Formular anzuzeigen. Wir klicken mit der rechten Maustaste in die erste Create-Methode und wählen "Ansicht hinzufügen" aus, um die Ansichtsvorlage für unser Filmformular zu erstellen.

Wir wählen aus, dass wir der Ansichtsvorlage einen "Movie" als Ansichtsdatenklasse übergeben und angeben, dass wir eine "Erstellen"-Vorlage "gerüstet" möchten.

Nachdem Sie auf die Schaltfläche Hinzufügen geklickt haben, wird die Vorlage \Movies\Create.aspx View für Sie erstellt. Da wir in der Dropdownliste "Inhalt anzeigen" die Option "Erstellen" ausgewählt haben, hat das Dialogfeld Ansicht hinzufügen automatisch einige Standardinhalte für uns "gerüstet". Das Gerüst hat ein HTML-Formular <>erstellt, einen Ort für Validierungsfehlermeldungen, und da das Gerüstbau über Filme weiß, wurden Label und Felder für jede Eigenschaft unserer Klasse erstellt.

<% using (Html.BeginForm()) {%>
    <%: Html.ValidationSummary(true) %>

    <fieldset>
        <legend>Fields</legend>
       
        <div class="editor-label">
            <%: Html.LabelFor(model => model.Id) %>
        </div>
        <div class="editor-field">
            <%: Html.TextBoxFor(model => model.Id) %>
            <%: Html.ValidationMessageFor(model => model.Id) %>
        </div>
       
        <div class="editor-label">
            <%: Html.LabelFor(model => model.Title) %>
        </div>
        <div class="editor-field">
            <%: Html.TextBoxFor(model => model.Title) %>
            <%: Html.ValidationMessageFor(model => model.Title) %>
        </div>
       
        <div class="editor-label">
            <%: Html.LabelFor(model => model.ReleaseDate) %>
        </div>
        <div class="editor-field">
            <%: Html.TextBoxFor(model => model.ReleaseDate) %>
            <%: Html.ValidationMessageFor(model => model.ReleaseDate) %>
        </div>
       
        <div class="editor-label">
            <%: Html.LabelFor(model => model.Genre) %>
        </div>
        <div class="editor-field">
            <%: Html.TextBoxFor(model => model.Genre) %>
            <%: Html.ValidationMessageFor(model => model.Genre) %>
        </div>
       
        <div class="editor-label">
            <%: Html.LabelFor(model => model.Price) %>
        </div>
        <div class="editor-field">
            <%: Html.TextBoxFor(model => model.Price) %>
            <%: Html.ValidationMessageFor(model => model.Price) %>
        </div>
       
        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>

<% } %>

Da unsere Datenbank einem Film automatisch eine ID zugibt, entfernen wir die Felder, die auf das Modell verweisen. Id aus unserer Create View. Entfernen Sie die 7 Zeilen nach <der Legende>Felder</Legende> , da sie das ID-Feld anzeigen, das wir nicht möchten.

Erstellen Sie nun einen neuen Film, und fügen Sie ihn der Datenbank hinzu. Hierzu führen Sie die Anwendung erneut aus, besuchen Sie die URL "/Movies", und klicken Sie auf den Link "Erstellen", um einen neuen Film hinzuzufügen.

Wenn wir auf die Schaltfläche Erstellen klicken, werden die Daten in diesem Formular (über HTTP POST) an die soeben erstellte /Movies/Create-Methode zurückgestellt. Genau wie wenn das System die Parameter "numTimes" und "name" automatisch aus der URL genommen und sie Parametern einer Methode zuvor zugeordnet hat, übernimmt das System automatisch die Formularfelder aus einem POST und zuordnen sie einem Objekt. In diesem Fall werden Werte aus Feldern in HTML wie "ReleaseDate" und "Title" automatisch in die richtigen Eigenschaften eines neuen instance eines Films eingefügt.

Sehen wir uns die zweite Create-Methode aus unserem MoviesController erneut an. Beachten Sie, wie ein "Movie"-Objekt als Argument verwendet wird:

[HttpPost]
public ActionResult Create(Movie newMovie)
{
    if (ModelState.IsValid)
    {
        db.AddToMovies(newMovie);
        db.SaveChanges();

        return RedirectToAction("Index");
    }
    else
    {
        return View(newMovie);
    }
}

Dieses Movie-Objekt wurde dann an die [HttpPost]-Version unserer Create-Aktionsmethode übergeben, und wir haben es in der Datenbank gespeichert und den Benutzer dann zurück zur Index()-Aktionsmethode weitergeleitet, die das gespeicherte Ergebnis in der Filmliste anzeigt:

Wir überprüfen jedoch nicht, ob unsere Filme korrekt sind, und die Datenbank erlaubt es uns nicht, einen Film ohne Titel zu speichern. Es wäre schön, wenn wir dem Benutzer mitteilen könnten, dass die Datenbank einen Fehler ausgelöst hat. Dazu fügen wir unserer Anwendung Validierungsunterstützung hinzu.

ZurückWeiter