Tworzenie aplikacji bazy danych filmów w ciągu 15 minut za pomocą wzorca ASP.NET MVC (VB)

Autor: Stephen Walther

Pobierz kod

Stephen Walther tworzy całą aplikację opartą na bazie danych ASP.NET MVC od początku do końca. Ten samouczek jest doskonałym wprowadzeniem dla osób, które są nowe w ASP.NET mvC Framework i chcą zrozumieć proces tworzenia aplikacji MVC ASP.NET.

Celem tego samouczka jest nadanie ci poczucia "jak to jest" do utworzenia ASP.NET aplikacji MVC. W tym samouczku wysadzam się przez kompilowanie całej aplikacji MVC ASP.NET od początku do końca. Pokażę, jak utworzyć prostą aplikację opartą na bazie danych, która ilustruje sposób wyświetlania listy, tworzenia i edytowania rekordów bazy danych.

Aby uprościć proces tworzenia aplikacji, skorzystamy z funkcji tworzenia szkieletów programu Visual Studio 2008. Pozwolimy programowi Visual Studio wygenerować początkowy kod i zawartość dla naszych kontrolerów, modeli i widoków.

Jeśli pracujesz z usługami Active Server Pages lub ASP.NET, warto zapoznać się z ASP.NET MVC. ASP.NET widoki MVC są bardzo podobne do stron w aplikacji Active Server Pages. Podobnie jak tradycyjna aplikacja ASP.NET Web Forms, ASP.NET MVC zapewnia pełny dostęp do bogatego zestawu języków i klas udostępnianych przez platformę .NET Framework.

Mam nadzieję, że ten samouczek pozwoli Ci zrozumieć, w jaki sposób środowisko tworzenia aplikacji MVC ASP.NET jest podobne i inne niż środowisko tworzenia stron serwera active server lub aplikacji ASP.NET Web Forms.

Omówienie aplikacji bazy danych filmów

Naszym celem jest proste zachowanie prostoty, dlatego utworzymy bardzo prostą aplikację Movie Database. Nasza prosta aplikacja Bazy danych filmów pozwoli nam wykonać trzy czynności:

  1. Wyświetlanie listy zestawów rekordów bazy danych filmów
  2. Tworzenie nowego rekordu bazy danych filmów
  3. Edytowanie istniejącego rekordu bazy danych filmów

Ponownie, ponieważ chcemy zachować prostotę, skorzystamy z minimalnej liczby funkcji platformy ASP.NET MVC potrzebnej do skompilowania naszej aplikacji. Na przykład nie będziemy korzystać z Test-Driven Development.

Aby utworzyć aplikację, należy wykonać każdą z następujących czynności:

  1. Tworzenie projektu aplikacji internetowej ASP.NET MVC
  2. Tworzenie bazy danych
  3. Tworzenie modelu bazy danych
  4. Tworzenie kontrolera MVC ASP.NET
  5. Tworzenie widoków MVC ASP.NET

Akcje wstępne

Aby utworzyć aplikację MVC ASP.NET, musisz mieć program Visual Studio 2008 lub Visual Web Developer 2008 Express. Należy również pobrać platformę ASP.NET MVC.

Jeśli nie jesteś właścicielem programu Visual Studio 2008, możesz pobrać 90-dniową wersję próbną programu Visual Studio 2008 z tej witryny internetowej:

https://msdn.microsoft.com/vs2008/products/cc268305.aspx

Alternatywnie możesz utworzyć ASP.NET aplikacje MVC za pomocą programu Visual Web Developer Express 2008. Jeśli zdecydujesz się korzystać z programu Visual Web Developer Express, musisz mieć zainstalowany dodatek Service Pack 1. Program Visual Web Developer 2008 Express z dodatkiem Service Pack 1 można pobrać z tej witryny sieci Web:

https://www.microsoft.com/downloads/details.aspx?FamilyId=BDB6391C-05CA-4036-9154-6DF4F6DEBD14& displaylang=en

Po zainstalowaniu programu Visual Studio 2008 lub Visual Web Developer 2008 należy zainstalować platformę ASP.NET MVC. Możesz pobrać platformę ASP.NET MVC z następującej witryny internetowej:

https://www.asp.net/mvc/

Uwaga

Zamiast pobierać strukturę ASP.NET i strukturę ASP.NET MVC pojedynczo, możesz skorzystać z Instalatora platformy internetowej. Instalator platformy internetowej to aplikacja, która umożliwia łatwe zarządzanie zainstalowanymi aplikacjami:

https://www.microsoft.com/web/gallery/Install.aspx

Tworzenie projektu aplikacji internetowej MVC ASP.NET

Zacznijmy od utworzenia nowego projektu aplikacji internetowej MVC ASP.NET w programie Visual Studio 2008. Wybierz opcję menu Plik, Nowy projekt i zostanie wyświetlone okno dialogowe Nowy projekt na rysunku 1. Wybierz język programowania Visual Basic i wybierz szablon projektu aplikacji internetowej MVC ASP.NET. Nadaj projektowi nazwę MovieApp i kliknij przycisk OK.

Zrzut ekranu przedstawiający okno dialogowe Nowy projekt z wyświetloną pozycją ASP dot Net MVC Web Application szablon jest zaznaczony i Aplikacja filmowa w polu Nazwa.

Rysunek 01. Okno dialogowe Nowy projekt (kliknij, aby wyświetlić obraz pełnowymiarowy)

Upewnij się, że wybierzesz pozycję .NET Framework 3.5 z listy rozwijanej w górnej części okna dialogowego Nowy projekt lub szablon projektu aplikacji internetowej ASP.NET MVC nie będzie wyświetlany.

Za każdym razem, gdy tworzysz nowy projekt aplikacji internetowej MVC, program Visual Studio monituje o utworzenie oddzielnego projektu testów jednostkowych. Zostanie wyświetlone okno dialogowe na rysunku 2. Ponieważ nie będziemy tworzyć testów w tym samouczku z powodu ograniczeń czasowych (i, tak, powinniśmy czuć się trochę winni tego) wybierz opcję Nie i kliknij przycisk OK .

Uwaga

Visual Web Developer nie obsługuje projektów testowych.

Zrzut ekranu przedstawiający tworzenie projektu testów jednostkowych, który jest wyświetlany jako Nie, nie twórz wybranego projektu testu jednostkowego.

Rysunek 02. Okno dialogowe Tworzenie projektu testów jednostkowych (kliknij, aby wyświetlić obraz pełnowymiarowy)

Aplikacja MVC ASP.NET ma standardowy zestaw folderów: modele, widoki i kontrolery. Ten standardowy zestaw folderów można wyświetlić w oknie Eksplorator rozwiązań. Aby utworzyć aplikację Bazy danych filmów, musimy dodać pliki do każdego z folderów Modele, Widoki i Kontrolery.

Podczas tworzenia nowej aplikacji MVC za pomocą programu Visual Studio uzyskasz przykładową aplikację. Ponieważ chcemy zacząć od podstaw, musimy usunąć zawartość dla tej przykładowej aplikacji. Należy usunąć następujący plik i następujący folder:

  • Controllers\HomeController.vb
  • Widoki\Strona główna

Tworzenie bazy danych

Musimy utworzyć bazę danych do przechowywania rekordów bazy danych filmów. Na szczęście program Visual Studio zawiera bezpłatną bazę danych o nazwie SQL Server Express. Wykonaj następujące kroki, aby utworzyć bazę danych:

  1. Kliknij prawym przyciskiem myszy folder App_Data w oknie Eksplorator rozwiązań i wybierz opcję menu Dodaj nowy element.
  2. Wybierz kategorię Dane i wybierz szablon bazy danych SQL Server (zobacz Rysunek 3).
  3. Nadaj nowej bazie danych nazwę MoviesDB.mdf i kliknij przycisk Dodaj .

Po utworzeniu bazy danych możesz nawiązać połączenie z bazą danych, klikając dwukrotnie plik MoviesDB.mdf znajdujący się w folderze App_Data. Dwukrotne kliknięcie pliku MoviesDB.mdf powoduje otwarcie okna Eksploratora serwera.

Uwaga

Okno Eksploratora serwera nosi nazwę okna Eksploratora baz danych w przypadku programu Visual Web Developer.

Zrzut ekranu przedstawiający okno Dodawanie nowego elementu, które pokazuje SQL Server wybraną bazę danych, a w polu Nazwa wprowadzono pozycję Filmy DB dot m d f.

Rysunek 03. Tworzenie bazy danych microsoft SQL Server (kliknij, aby wyświetlić obraz w pełnym rozmiarze)

Następnie musimy utworzyć nową tabelę bazy danych. W oknie Eksplorator serwera kliknij prawym przyciskiem myszy folder Tables i wybierz opcję menu Dodaj nową tabelę. Wybranie tej opcji menu powoduje otwarcie projektanta tabel bazy danych. Utwórz następujące kolumny bazy danych:

Nazwa kolumny Typ danych Zezwalaj na wartości null
Id int Fałsz
Tytuł Nvarchar(100) Fałsz
Dyrektor Nvarchar(100) Fałsz
Data wydania DateTime Fałsz

Pierwsza kolumna, kolumna Id, ma dwie specjalne właściwości. Najpierw należy oznaczyć kolumnę Id jako kolumnę klucza podstawowego. Po wybraniu kolumny Id kliknij przycisk Ustaw klucz podstawowy (jest to ikona, która wygląda jak klucz). Po drugie należy oznaczyć kolumnę Id jako kolumnę Tożsamość. W okno Właściwości kolumny przewiń w dół do sekcji Specyfikacja tożsamości i rozwiń ją. Zmień właściwość Is Identity na wartość Tak. Po zakończeniu tabela powinna wyglądać jak Rysunek 4.

Zrzut ekranu programu Microsoft Visual Studio przedstawiający ukończoną tabelę bazy danych Filmy i właściwość Is Identity ustawioną na Wartość Tak.

Rysunek 04. Tabela bazy danych Filmy (kliknij, aby wyświetlić obraz pełnowymiarowy)

Ostatnim krokiem jest zapisanie nowej tabeli. Kliknij przycisk Zapisz (ikona dyskietki) i nadaj nowej tabeli nazwę Filmy.

Po zakończeniu tworzenia tabeli dodaj do tabeli kilka rekordów filmowych. Kliknij prawym przyciskiem myszy tabelę Filmy w oknie Eksplorator serwera i wybierz opcję menu Pokaż dane tabeli. Wprowadź listę ulubionych filmów (zobacz Rysunek 5).

Zrzut ekranu przedstawiający okno programu Microsoft Visual Studio zawierające tabelę do wprowadzania informacji o filmie, w tym identyfikatora, tytułu, reżysera i daty wydania.

Rysunek 05. Wprowadzanie rekordów filmowych (kliknij, aby wyświetlić obraz pełnowymiarowy)

Tworzenie modelu

Następnie musimy utworzyć zestaw klas reprezentujących naszą bazę danych. Musimy utworzyć model bazy danych. Skorzystamy z programu Microsoft Entity Framework, aby automatycznie wygenerować klasy dla naszego modelu bazy danych.

Uwaga

Struktura MVC ASP.NET nie jest powiązana z programem Microsoft Entity Framework. Klasy modelu bazy danych można utworzyć, korzystając z różnych narzędzi mapowania obiektów (OR/M), w tym LINQ to SQL, subsonic i NHibernate.

Wykonaj następujące kroki, aby uruchomić Kreatora modelu danych jednostek:

  1. Kliknij prawym przyciskiem myszy folder Models w oknie Eksplorator rozwiązań, a następnie wybierz opcję menu Dodaj, Nowy element.
  2. Wybierz kategorię Dane i wybierz szablon modelu danych jednostki ADO.NET.
  3. Nadaj modelowi danych nazwę MoviesDBModel.edmx i kliknij przycisk Dodaj .

Po kliknięciu przycisku Dodaj zostanie wyświetlony Kreator modelu danych jednostek (zobacz Rysunek 6). Wykonaj następujące kroki, aby ukończyć pracę kreatora:

  1. W kroku Wybieranie zawartości modelu wybierz opcję Generuj z bazy danych .
  2. W kroku Wybierz połączenie danych użyj połączenia danych MoviesDB.mdf i nazwy MoviesDBEntities dla ustawień połączenia. Kliknij przycisk Dalej.
  3. W kroku Wybieranie obiektów bazy danych rozwiń węzeł Tabele, wybierz tabelę Filmy. Wprowadź przestrzeń nazw MovieApp.Models i kliknij przycisk Zakończ .

Zrzut ekranu przedstawiający pole Kreator modelu danych jednostki z wybraną ikoną Generuj na podstawie bazy danych.

Rysunek 06. Generowanie modelu bazy danych za pomocą Kreatora modelu danych jednostek (kliknij, aby wyświetlić obraz w pełnym rozmiarze)

Po zakończeniu pracy Kreatora modelu danych jednostki zostanie otwarty Projektant modelu danych jednostki. W Projektant powinna zostać wyświetlona tabela bazy danych Filmy (patrz Rysunek 7).

Zrzut ekranu przedstawiający Projektant modelu danych jednostek, który przedstawia tabelę bazy danych Filmy.

Rysunek 07. Model danych jednostki Projektant (kliknij, aby wyświetlić obraz w pełnym rozmiarze)

Zanim przejdziemy dalej, musimy wprowadzić jedną zmianę. Kreator danych jednostki generuje klasę modelu o nazwie Filmy, która reprezentuje tabelę bazy danych Filmy. Ponieważ użyjemy klasy Filmy do reprezentowania określonego filmu, musimy zmodyfikować nazwę klasy Jako Film zamiast Filmy (pojedyncza, a nie liczba mnoga).

Kliknij dwukrotnie nazwę klasy na powierzchni projektanta i zmień nazwę klasy z Filmy na Movie. Po wprowadzeniu tej zmiany kliknij przycisk Zapisz (ikonę dyskietki), aby wygenerować klasę Movie.

Tworzenie kontrolera MVC ASP.NET

Następnym krokiem jest utworzenie kontrolera MVC ASP.NET. Kontroler jest odpowiedzialny za kontrolowanie sposobu interakcji użytkownika z aplikacją MVC ASP.NET.

Wykonaj następujące kroki:

  1. W oknie Eksplorator rozwiązań kliknij prawym przyciskiem myszy folder Controllers i wybierz opcję menu Dodaj, Kontroler.
  2. W oknie dialogowym Dodawanie kontrolera wprowadź nazwę HomeController i zaznacz pole wyboru z etykietą Dodaj metody akcji dla scenariuszy Tworzenia, aktualizacji i szczegółów (zobacz Rysunek 8).
  3. Kliknij przycisk Dodaj , aby dodać nowy kontroler do projektu.

Po wykonaniu tych kroków zostanie utworzony kontroler na liście 1. Zwróć uwagę, że zawiera metody o nazwach Index, Details, Create i Edit. W poniższych sekcjach dodamy niezbędny kod, aby te metody działały.

Zrzut ekranu przedstawiający pole Dodaj kontroler, które pokazuje wprowadzony kontroler macierzysny i pole akcji dodawania zaznaczone.

Rysunek 08. Dodawanie nowego kontrolera MVC ASP.NET (kliknij, aby wyświetlić obraz o pełnym rozmiarze)

Lista 1 — Controllers\HomeController.vb

Public Class HomeController

        Inherits System.Web.Mvc.Controller 

        '

        ' GET: /Home/ 

        Function Index() As ActionResult

            Return View()

        End Function 

        '

        ' GET: /Home/Details/5 

        Function Details(ByVal id As Integer) As ActionResult

            Return View()

        End Function 

        '

        ' GET: /Home/Create 

        Function Create() As ActionResult

            Return View()

        End Function 

        '

        ' POST: /Home/Create 

        <AcceptVerbs(HttpVerbs.Post)> _

        Function Create(ByVal collection As FormCollection) As ActionResult

            Try

                ' TODO: Add insert logic here

                Return RedirectToAction("Index")

            Catch

                Return View()

            End Try

        End Function 

        '

        ' GET: /Home/Edit/5 

        Function Edit(ByVal id As Integer) As ActionResult

            Return View()

        End Function 

        '

        ' POST: /Home/Edit/5 

        <AcceptVerbs(HttpVerbs.Post)> _

        Function Edit(ByVal id As Integer, ByVal collection As FormCollection) As ActionResult

            Try

                ' TODO: Add update logic here 

                Return RedirectToAction("Index")

            Catch

                Return View()

            End Try

        End Function

    End Class

Wyświetlanie listy rekordów bazy danych

Metoda Index() kontrolera Home jest domyślną metodą dla aplikacji MVC ASP.NET. Po uruchomieniu ASP.NET aplikacji MVC metoda Index() jest pierwszą wywoływaną metodą kontrolera.

Użyjemy metody Index(), aby wyświetlić listę rekordów z tabeli bazy danych Filmy. Skorzystamy z utworzonych wcześniej klas modelu bazy danych w celu pobrania rekordów bazy danych filmów za pomocą metody Index().

Zmodyfikowano klasę HomeController na liście 2, tak aby zawierała nowe pole prywatne o nazwie _db. Klasa MoviesDBEntities reprezentuje nasz model bazy danych i użyjemy tej klasy do komunikowania się z naszą bazą danych.

Zmodyfikowano również metodę Index() w liście 2. Metoda Index() używa klasy MoviesDBEntities do pobierania wszystkich rekordów filmów z tabeli bazy danych Filmy. Wyrażenie _db. Metoda MovieSet.ToList() zwraca listę wszystkich rekordów filmów z tabeli bazy danych Filmy.

Lista filmów jest przekazywana do widoku. Wszystkie elementy przekazywane do metody View() są przekazywane do widoku jako dane widoku.

Lista 2 — Controllers/HomeController.vb (zmodyfikowana metoda indeksu)

Public Class HomeController

        Inherits System.Web.Mvc.Controller 

        Private _db As New MoviesDBEntities() 

        Function Index() As ActionResult

            Return View(_db.MovieSet.ToList())

        End Function

    End Class

Metoda Index() zwraca widok o nazwie Index. Musimy utworzyć ten widok, aby wyświetlić listę rekordów bazy danych filmów. Wykonaj następujące kroki:

Przed otwarciem okna dialogowego Dodawanie widoku należy skompilować projekt (wybierz opcję menu Kompiluj rozwiązanie) lub na liście rozwijanej Wyświetl klasę danych nie będą wyświetlane żadne klasy.

  1. Kliknij prawym przyciskiem myszy metodę Index() w edytorze kodu i wybierz opcję menu Dodaj widok (zobacz Rysunek 9).
  2. W oknie dialogowym Dodawanie widoku sprawdź, czy pole wyboru z etykietą Utwórz silnie typizowanego widoku jest zaznaczone.
  3. Z listy rozwijanej Wyświetl zawartość wybierz wartość Lista.
  4. Z listy rozwijanej Wyświetl klasę danych wybierz wartość MovieApp.Movie.
  5. Kliknij przycisk Dodaj, aby utworzyć nowy widok (zobacz Rysunek 10).

Po wykonaniu tych kroków do folderu Views\Home zostanie dodany nowy widok o nazwie Index.aspx. Zawartość widoku Indeks znajduje się w liście 3.

Zrzut ekranu edytora kodu pokazujący pole listy rozwijanej kliknięcie prawym przyciskiem myszy z wybraną pozycją Dodaj widok.

Rysunek 09. Dodawanie widoku z akcji kontrolera (kliknij, aby wyświetlić obraz o pełnym rozmiarze)

Zrzut ekranu przedstawiający pole Dodaj widok z wyświetloną pozycją Nazwa widoku, Indeks i Pokazuje opcję Utwórz silnie typizowane widoki i Wybierz wybrane wpisy strony wzorcowej.

Rysunek 10. Tworzenie nowego widoku za pomocą okna dialogowego Dodawanie widoku (kliknij, aby wyświetlić obraz pełnowymiarowy)

<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage(Of IEnumerable (Of MovieApp.Movie))" %> 

    <asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">

       Index

    </asp:Content> 

    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"> 

        <h2>Index</h2> 

        <p>

            <%=Html.ActionLink("Create New", "Create")%>

        </p>

        <table>

            <tr>

                <th></th>

                <th>

                    Id

                </th>

                <th>

                    Title

                </th>

                <th>

                    Director

                </th>

                <th>

                    DateReleased

                </th>

            </tr> 

        <% For Each item In Model%>

            <tr>

                <td>

                    <%=Html.ActionLink("Edit", "Edit", New With {.id = item.Id})%> |

                    <%=Html.ActionLink("Details", "Details", New With {.id = item.Id})%>

                </td>

                <td>

                    <%= Html.Encode(item.Id) %>

                </td>

                <td>

                    <%= Html.Encode(item.Title) %>

                </td>

                <td>

                    <%= Html.Encode(item.Director) %>

                </td>

                <td>

                    <%= Html.Encode(String.Format("{0:g}", item.DateReleased)) %>

                </td>

            </tr>

        <% Next%> 

        </table> 

    </asp:Content>

Widok Indeks wyświetla wszystkie rekordy filmów z tabeli bazy danych Filmy w tabeli HTML. Widok zawiera pętlę For Each, która iteruje po każdym filmie reprezentowanym przez właściwość ViewData.Model. Jeśli uruchomisz aplikację, naciskając klawisz F5, zobaczysz stronę internetową na rysunku 11.

Zrzut ekranu przedstawiający widok indeksu przedstawiający informacje o filmie, w tym identyfikator, tytuł, reżyser i datę wydania.

Rysunek 11. Widok indeksu (kliknij, aby wyświetlić obraz pełnowymiarowy)

Tworzenie nowych rekordów bazy danych

Widok Indeks utworzony w poprzedniej sekcji zawiera link do tworzenia nowych rekordów bazy danych. Zaimplementujmy logikę i utwórzmy widok niezbędny do tworzenia nowych rekordów bazy danych filmów.

Kontroler macierzystowy zawiera dwie metody o nazwie Create(). Pierwsza metoda Create() nie ma parametrów. To przeciążenie metody Create() służy do wyświetlania formularza HTML do tworzenia nowego rekordu bazy danych filmów.

Druga metoda Create() ma parametr FormCollection. To przeciążenie metody Create() jest wywoływane, gdy formularz HTML do tworzenia nowego filmu jest publikowany na serwerze. Zauważ, że ta druga metoda Create() ma atrybut AcceptVerbs, który uniemożliwia wywoływanie metody, chyba że zostanie wykonana operacja POST PROTOKOŁU HTTP.

Ta druga metoda Create() została zmodyfikowana w zaktualizowanej klasie HomeController w liście 4. Nowa wersja metody Create() akceptuje parametr Movie i zawiera logikę wstawiania nowego filmu do tabeli bazy danych Filmy.

Uwaga

Zwróć uwagę na atrybut Bind. Ponieważ nie chcemy aktualizować właściwości Identyfikator filmu z formularza HTML, musimy jawnie wykluczyć tę właściwość.

Lista 4 — Controllers\HomeController.vb (zmodyfikowana metoda Create)

Function Create() As ActionResult

            Return View()

        End Function 

        <AcceptVerbs(HttpVerbs.Post)> _

        Function Create(<_bind28_exclude3a_3d_22_id22_29_> ByVal movieToCreate As Movie) As ActionResult 

            If Not ModelState.IsValid Then

                Return View()

            End If 

            _db.AddToMovieSet(movieToCreate)

            _db.SaveChanges() 

            Return RedirectToAction("Index")

        End Function 
<!--_bind28_exclude3a_3d_22_id22_29_-->

Program Visual Studio ułatwia tworzenie formularza do tworzenia nowego rekordu bazy danych filmów (zobacz Rysunek 12). Wykonaj następujące kroki:

  1. Kliknij prawym przyciskiem myszy metodę Create() w edytorze kodu i wybierz opcję menu Dodaj widok.
  2. Sprawdź, czy pole wyboru z etykietą Utwórz widok silnie typizowane jest zaznaczone.
  3. Z listy rozwijanej Wyświetl zawartość wybierz wartość Utwórz.
  4. Z listy rozwijanej Wyświetl klasę danych wybierz wartość MovieApp.Movie.
  5. Kliknij przycisk Dodaj , aby utworzyć nowy widok.

Zrzut ekranu przedstawiający pole Dodaj widok dla pola Nazwa widoku, Utwórz, które pokazuje pozycję Utwórz silnie wpisany widok i wybierz wybrane pozycje strony wzorcowej.

Rysunek 12. Dodawanie widoku Tworzenia (kliknij, aby wyświetlić obraz pełnowymiarowy)

Program Visual Studio automatycznie generuje widok na liście 5. Ten widok zawiera formularz HTML zawierający pola odpowiadające poszczególnym właściwościom klasy Movie.

Lista 5 — views\Home\Create.aspx

<%@ Page Title="" Language="VB" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage(Of MovieApp.Movie)" %> 

    <asp:Content ID="Content3" ContentPlaceHolderID="TitleContent" runat="server">

       Create

    </asp:Content> 

    <asp:Content ID="Content4" ContentPlaceHolderID="MainContent" runat="server"> 

        <h2>Create</h2> 

        <%= Html.ValidationSummary("Create was unsuccessful. Please correct the errors and try again.") %> 

        <% Using Html.BeginForm()%> 

            <fieldset>

                <legend>Fields</legend>

                <p>

                    <label for="Id">Id:</label>

                    <%= Html.TextBox("Id") %>

                    <%= Html.ValidationMessage("Id", "*") %>

                </p>

                <p>

                    <label for="Title">Title:</label>

                    <%= Html.TextBox("Title") %>

                    <%= Html.ValidationMessage("Title", "*") %>

                </p>

                <p>

                    <label for="Director">Director:</label>

                    <%= Html.TextBox("Director") %>

                    <%= Html.ValidationMessage("Director", "*") %>

                </p>

                <p>

                    <label for="DateReleased">DateReleased:</label>

                    <%= Html.TextBox("DateReleased") %>

                    <%= Html.ValidationMessage("DateReleased", "*") %>

                </p>

                <p>

                    <input type="submit" value="Create" />

                </p>

            </fieldset> 

        <% End Using %> 

        <div>

            <%=Html.ActionLink("Back to List", "Index") %>

        </div> 

    </asp:Content>

Uwaga

Formularz HTML wygenerowany przez okno dialogowe Dodawanie widoku generuje pole formularza Identyfikator. Ponieważ kolumna Identyfikator jest kolumną Identity, nie potrzebujemy tego pola formularza i można go bezpiecznie usunąć.

Po dodaniu widoku Utwórz możesz dodać nowe rekordy filmowe do bazy danych. Uruchom aplikację, naciskając klawisz F5, a następnie kliknij link Utwórz nowy, aby wyświetlić formularz na rysunku 13. Po zakończeniu i przesłaniu formularza zostanie utworzony nowy rekord bazy danych filmów.

Zwróć uwagę, że automatycznie uzyskujesz walidację formularza. Jeśli nie wprowadzisz daty wydania filmu lub wprowadzisz nieprawidłową datę wydania, formularz zostanie ponownie odtworzona, a pole data wydania zostanie wyróżnione.

Zrzut ekranu przedstawiający stronę Tworzenie widoku, która zawiera wymagane pola bazy danych tytułu, dyrektora i daty wydania.

Rysunek 13. Tworzenie nowego rekordu bazy danych filmów (kliknij, aby wyświetlić obraz pełnowymiarowy)

Edytowanie istniejących rekordów bazy danych

W poprzednich sekcjach omówiono sposób wyświetlania listy i tworzenia nowych rekordów bazy danych. W tej ostatniej sekcji omówiono sposób edytowania istniejących rekordów bazy danych.

Najpierw musimy wygenerować formularz Edytuj. Ten krok jest łatwy, ponieważ program Visual Studio automatycznie wygeneruje formularz Edycji. Otwórz klasę HomeController.vb w edytorze kodu programu Visual Studio i wykonaj następujące kroki:

  1. Kliknij prawym przyciskiem myszy metodę Edit() w edytorze kodu i wybierz opcję menu Dodaj widok (zobacz Rysunek 14).
  2. Zaznacz pole wyboru z etykietą Utwórz silnie typizowanego widoku.
  3. Z listy rozwijanej Wyświetl zawartość wybierz wartość Edytuj.
  4. Z listy rozwijanej Wyświetl klasę danych wybierz wartość MovieApp.Movie.
  5. Kliknij przycisk Dodaj , aby utworzyć nowy widok.

Wykonanie tych kroków spowoduje dodanie nowego widoku o nazwie Edit.aspx do folderu Views\Home. Ten widok zawiera formularz HTML do edycji rekordu filmowego.

Zrzut ekranu przedstawiający pole Dodaj widok dla pola Nazwa widoku, Edytuj, które pokazuje pozycję Utwórz silnie typizowanego widoku i Wybierz wybrane pozycje strony wzorcowej.

Rysunek 14. Dodawanie widoku edycji (kliknij, aby wyświetlić obraz pełnowymiarowy)

Uwaga

Widok Edytuj zawiera pole formularza HTML odpowiadające właściwości Identyfikator filmu. Ponieważ nie chcesz, aby osoby edytujące wartość właściwości Id, należy usunąć to pole formularza.

Na koniec musimy zmodyfikować kontroler główny, aby obsługiwał edytowanie rekordu bazy danych. Zaktualizowana klasa HomeController znajduje się na liście 6.

Lista 6 — Controllers\HomeController.vb (metody edycji)

Function Edit(ByVal id As Integer) As ActionResult

            Dim movieToEdit = (From m In _db.MovieSet _

                           Where m.Id = id _

                           Select m).First() 

            Return View(movieToEdit)

        End Function 

        <AcceptVerbs(HttpVerbs.Post)> _

        Function Edit(ByVal movieToEdit As Movie) As ActionResult 

            Dim originalMovie = (From m In _db.MovieSet _

                       Where m.Id = movieToEdit.Id _

                       Select m).First() 

            If Not ModelState.IsValid Then

                Return View(originalMovie)

            End If 

            _db.ApplyPropertyChanges(originalMovie.EntityKey.EntitySetName, movieToEdit)

            _db.SaveChanges() 

            Return RedirectToAction("Index")

        End Function

Na liście 6 dodano dodatkową logikę do obu przeciążeń metody Edit(). Pierwsza metoda Edit() zwraca rekord bazy danych filmu, który odpowiada parametrowi Id przekazanemu do metody. Drugie przeciążenie wykonuje aktualizacje rekordu filmu w bazie danych.

Zwróć uwagę, że musisz pobrać oryginalny film, a następnie wywołać metodę ApplyPropertyChanges(), aby zaktualizować istniejący film w bazie danych.

Podsumowanie

Celem tego samouczka było zapewnienie doświadczenia w tworzeniu aplikacji ASP.NET MVC. Mam nadzieję, że odkryliśmy, że tworzenie aplikacji internetowej ASP.NET MVC jest bardzo podobne do środowiska tworzenia aplikacji Active Server Pages lub ASP.NET.

W tym samouczku przeanalizowaliśmy tylko najbardziej podstawowe funkcje platformy ASP.NET MVC. W przyszłych samouczkach szczegółowo omówimy tematy, takie jak kontrolery, akcje kontrolera, widoki, wyświetlanie danych i pomocnicy HTML.