Создание приложения базы данных Movie за 15 минут с помощью ASP.NET MVC (VB)
Стивен Уолтер (Stephen Walther)
Стивен Уолтер создает всю управляемую базой данных ASP.NET приложение MVC от начала до конца. Это руководство является отличным введением для пользователей, которые не знакомы с ASP.NET MVC Framework и хотят получить представление о процессе создания приложения ASP.NET MVC.
Цель этого руководства — дать вам представление о том, что это такое при создании приложения ASP.NET MVC. В этом руководстве рассматривается создание всего приложения MVC ASP.NET от начала до конца. Я показываю вам, как создать простое приложение, управляемое базой данных, которое иллюстрирует, как можно выводить список, создавать и изменять записи базы данных.
Чтобы упростить процесс создания приложения, мы воспользуемся преимуществами функций формирования шаблонов в Visual Studio 2008. Мы разрешим Visual Studio создать исходный код и содержимое для наших контроллеров, моделей и представлений.
Если вы работали с Active Server Pages или ASP.NET, то ASP.NET MVC хорошо знакомы. ASP.NET представления MVC очень похожи на страницы в приложении Active Server Pages. Как и традиционное приложение ASP.NET Web Forms, ASP.NET MVC предоставляет полный доступ к богатому набору языков и классов, предоставляемых платформой .NET Framework.
Я надеюсь, что это руководство даст вам представление о том, насколько опыт создания приложения ASP.NET MVC аналогичен и отличается от опыта создания приложения Active Server Pages или ASP.NET Web Forms.
Общие сведения о приложении базы данных фильмов
Так как наша цель заключается в простоте, мы создадим очень простое приложение Базы данных фильмов. Наше простое приложение "База данных фильмов" позволит нам выполнять три действия:
- Вывод списка записей базы данных фильмов
- Создание новой записи базы данных фильмов
- Изменение существующей записи базы данных фильмов
Опять же, так как мы хотим обеспечить простоту, мы воспользуемся минимальным количеством функций платформы ASP.NET MVC, необходимых для создания приложения. Например, мы не будем использовать преимущества разработки Test-Driven.
Чтобы создать приложение, необходимо выполнить все следующие действия:
- Создание проекта веб-приложения MVC ASP.NET
- Создание базы данных
- Создание модели базы данных
- Создание контроллера MVC ASP.NET
- Создание ASP.NET представлений MVC
Предварительные требования
Для создания приложения ASP.NET MVC потребуется Visual Studio 2008 или Visual Web Developer 2008 Express. Также необходимо скачать платформу ASP.NET MVC.
Если у вас нет Visual Studio 2008, вы можете скачать 90-дневную пробную версию Visual Studio 2008 с этого веб-сайта:
https://msdn.microsoft.com/vs2008/products/cc268305.aspx
Кроме того, можно создавать ASP.NET приложения MVC с помощью Visual Web Developer Express 2008. Если вы решили использовать Visual Web Developer Express, необходимо установить пакет обновления 1 (SP1). Вы можете скачать Visual Web Developer 2008 Express с пакетом обновления 1 (SP1) с этого веб-сайта:
После установки Visual Studio 2008 или Visual Web Developer 2008 необходимо установить платформу ASP.NET MVC. Вы можете скачать платформу ASP.NET MVC со следующего веб-сайта:
Примечание
Вместо того, чтобы скачивать платформу ASP.NET и платформу ASP.NET MVC по отдельности, можно воспользоваться установщиком веб-платформы. Установщик веб-платформы — это приложение, которое позволяет легко управлять установленными приложениями на вашем компьютере:
Создание проекта веб-приложения ASP.NET MVC
Начнем с создания нового проекта веб-приложения MVC ASP.NET в Visual Studio 2008. Выберите пункт меню Файл, Создать проект, и вы увидите диалоговое окно Новый проект на рис. 1. Выберите Visual Basic в качестве языка программирования и выберите шаблон проекта ASP.NET веб-приложение MVC. Присвойте проекту имя MovieApp и нажмите кнопку ОК.
Рис. 01. Диалоговое окно "Новый проект" (щелкните для просмотра полноразмерного изображения)
Убедитесь, что вы выбрали платформа .NET Framework 3.5 в раскрывающемся списке в верхней части диалогового окна Новый проект, иначе шаблон проекта веб-приложения ASP.NET MVC не отображается.
Всякий раз, когда вы создаете новый проект веб-приложения MVC, Visual Studio предлагает создать отдельный проект модульного теста. Откроется диалоговое окно на рис. 2. Так как мы не будем создавать тесты в этом руководстве из-за ограничений по времени (и, да, мы должны чувствовать себя немного виноватыми в этом), выберите параметр Нет и нажмите кнопку ОК .
Примечание
Visual Web Developer не поддерживает тестовые проекты.
Рис. 02. Диалоговое окно "Создание проекта модульного теста" (щелкните для просмотра полноразмерного изображения)
Приложение ASP.NET MVC имеет стандартный набор папок: папки "Модели", "Представления" и "Контроллеры". Этот стандартный набор папок можно просмотреть в окне Обозреватель решений. Чтобы создать приложение Базы данных фильмов, необходимо добавить файлы в каждую папку Модели, Представления и Контроллеры.
При создании приложения MVC с помощью Visual Studio вы получаете пример приложения. Так как мы хотим начать с нуля, необходимо удалить содержимое этого примера приложения. Необходимо удалить следующий файл и следующую папку:
- Controllers\HomeController.vb
- Views\Home
Создание базы данных
Нам нужно создать базу данных для хранения записей базы данных фильмов. К счастью, Visual Studio включает бесплатную базу данных с именем SQL Server Express. Чтобы создать базу данных, выполните следующие действия.
- Щелкните правой кнопкой мыши папку App_Data в окне Обозреватель решений и выберите пункт меню Добавить, Новый элемент.
- Выберите категорию Данные и шаблон базы данных SQL Server (см. рис. 3).
- Присвойте новой базе данных имя MoviesDB.mdf и нажмите кнопку Добавить .
После создания базы данных можно подключиться к ней, дважды щелкнув файл MoviesDB.mdf, расположенный в папке App_Data. При двойном щелчке файла MoviesDB.mdf откроется окно Обозреватель сервера.
Примечание
Окно Обозреватель сервера называется окном Обозреватель базы данных в случае Visual Web Developer.
Рис. 03. Создание базы данных Microsoft SQL Server (щелкните для просмотра полноразмерного изображения)
Далее необходимо создать таблицу базы данных. В окне Обозреватель Sever щелкните правой кнопкой мыши папку Таблицы и выберите пункт меню Добавить новую таблицу. При выборе этого пункта меню откроется конструктор таблиц баз данных. Создайте следующие столбцы базы данных:
| Имя столбца | Тип данных | Разрешить значения NULL |
|---|---|---|
| Идентификатор | Int | Неверно |
| Заголовок | Nvarchar(100) | Неверно |
| Директор | Nvarchar(100) | Неверно |
| Дата, дата, датасложенная | Дата и время | Неверно |
Первый столбец, столбец Id, имеет два специальных свойства. Сначала необходимо пометить столбец Id как первичный ключевой столбец. Выбрав столбец Идентификатор, нажмите кнопку Задать первичный ключ (это значок, который выглядит как ключ). Во-вторых, необходимо пометить столбец Id как столбец Идентификатор. В окно свойств Столбцы прокрутите вниз до раздела Спецификация удостоверения и разверните его. Измените свойство Is Identity на значение Да. По завершении таблица должна выглядеть так, как на рисунке 4.
Рис. 04. Таблица базы данных Movies (щелкните для просмотра полноразмерного изображения)
Последним шагом является сохранение новой таблицы. Нажмите кнопку Сохранить (значок дискеты) и присвойте новой таблице имя Фильмы.
Завершив создание таблицы, добавьте в нее записи фильмов. Щелкните правой кнопкой мыши таблицу Movies в окне Обозреватель сервера и выберите пункт меню Показать данные таблицы. Введите список любимых фильмов (см. рис. 5).
Рис. 05. Ввод записей фильмов (щелкните для просмотра полноразмерного изображения)
Создание модели
Далее необходимо создать набор классов для представления базы данных. Необходимо создать модель базы данных. Мы воспользуемся преимуществами Microsoft Entity Framework для автоматического создания классов для модели базы данных.
Примечание
Платформа ASP.NET MVC не привязана к Microsoft Entity Framework. Вы можете создать классы модели базы данных, используя различные средства объектно-реляционного сопоставления (OR/M), включая LINQ to SQL, Subsonic и NHibernate.
Выполните следующие действия, чтобы запустить мастер модели entity data.
- Щелкните правой кнопкой мыши папку Models в окне Обозреватель решений и выберите пункт меню Добавить, Новый элемент.
- Выберите категорию Данные и выберите шаблон модель ADO.NET entity Data Model .
- Присвойте модели данных имя MoviesDBModel.edmx и нажмите кнопку Добавить .
После нажатия кнопки Добавить откроется мастер моделей entity data model (см. рис. 6). Чтобы завершить работу мастера, выполните следующие действия.
- На шаге Выбор содержимого модели выберите параметр Создать из базы данных .
- На шаге Выбор подключения к данным используйте подключение к данным MoviesDB.mdf и имя MoviesDBEntities для параметров подключения. Нажмите кнопку Далее.
- На шаге Выбор объектов базы данных разверните узел Таблицы и выберите таблицу Фильмы. Введите пространство имен MovieApp.Models и нажмите кнопку Готово .
Рис. 06. Создание модели базы данных с помощью мастера моделей данных сущностей (щелкните для просмотра полноразмерного изображения)
После завершения работы мастера модели сущностей откроется Designer Entity Data Model ( Модель entityяныхх). В Designer должна отображаться таблица базы данных Movies (см. рис. 7).
Рис. 07. Designer модели данных сущностей (щелкните для просмотра полноразмерного изображения)
Прежде чем продолжить, необходимо внести одно изменение. Мастер данных сущностей создает класс модели с именем Movies, который представляет таблицу базы данных Movies. Так как мы будем использовать класс Movies для представления определенного фильма, необходимо изменить имя класса, чтобы оно было Movie вместо Movies (единственное, а не множественное число).
Дважды щелкните имя класса в области конструктора и измените имя класса с Movies на Movie. После внесения этого изменения нажмите кнопку Сохранить (значок дискеты), чтобы создать класс Movie.
Создание контроллера MVC ASP.NET
Следующим шагом является создание контроллера MVC ASP.NET. Контроллер отвечает за управление взаимодействием пользователя с ASP.NET приложением MVC.
Выполните следующие действия.
- В окне Обозреватель решений щелкните правой кнопкой мыши папку Контроллеры и выберите пункт меню Добавить, Контроллер.
- В диалоговом окне Добавление контроллера введите имя HomeController и проверка флажок Добавить методы действий для сценариев создания, обновления и сведений (см. рис. 8).
- Нажмите кнопку Добавить , чтобы добавить новый контроллер в проект.
После выполнения этих действий создается контроллер в листинге 1. Обратите внимание, что он содержит методы с именами Index, Details, Create и Edit. В следующих разделах мы добавим код, необходимый для работы этих методов.
Рис. 08. Добавление нового ASP.NET контроллера MVC (щелкните для просмотра полноразмерного изображения)
Листинг 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
Перечисление записей базы данных
Метод Index() контроллера Home является методом по умолчанию для приложения ASP.NET MVC. При запуске приложения ASP.NET MVC метод Index() является первым вызываемым методом контроллера.
Мы будем использовать метод Index() для отображения списка записей из таблицы базы данных Movies. Мы воспользуемся преимуществами классов модели базы данных, созданных ранее, для получения записей базы данных фильмов с помощью метода Index().
Я изменил класс HomeController в листинге 2, чтобы он содержал новое частное поле с именем _db. Класс MoviesDBEntities представляет модель базы данных, и мы будем использовать этот класс для взаимодействия с базой данных.
Я также изменил метод Index() в листинге 2. Метод Index() использует класс MoviesDBEntities для получения всех записей фильмов из таблицы базы данных Movies. Выражение _db. MovieSet.ToList() возвращает список всех записей фильмов из таблицы базы данных Movies.
Список фильмов передается в представление. Все, что передается методу View(), передается в представление в виде данных представления.
Листинг 2. Controllers/HomeController.vb (измененный метод Index)
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
Метод Index() возвращает представление с именем Index. Нам нужно создать это представление, чтобы отобразить список записей базы данных фильмов. Выполните следующие действия.
Перед открытием диалогового окна Добавление представления необходимо выполнить сборку проекта (выберите пункты меню Сборка, Сборка решения), иначе в раскрывающемся списке Просмотреть класс данных не будут отображаться классы.
- Щелкните правой кнопкой мыши метод Index() в редакторе кода и выберите пункт меню Добавить представление (см. рис. 9).
- В диалоговом окне Добавление представления убедитесь, что установлен флажок Создать строго типизированное представление .
- В раскрывающемся списке Просмотреть содержимое выберите значение Список.
- В раскрывающемся списке Просмотреть класс данных выберите значение MovieApp.Movie.
- Нажмите кнопку Добавить, чтобы создать новое представление (см. рис. 10).
После выполнения этих действий в папку Views\Home добавляется новое представление с именем Index.aspx. Содержимое представления индекса включено в листинг 3.
Рис. 09. Добавление представления из действия контроллера (щелкните, чтобы просмотреть полноразмерное изображение)
Рис. 10. Создание нового представления с помощью диалогового окна Добавление представления (щелкните, чтобы просмотреть полноразмерное изображение)
<%@ 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>
В представлении Индекс отображаются все записи фильмов из таблицы базы данных Movies в html-таблице. Представление содержит цикл For Each, который выполняет итерацию по каждому фильму, представленному свойством ViewData.Model. Если вы запустите приложение, нажав клавишу F5, вы увидите веб-страницу на рис. 11.
Рис. 11. Представление индекса (щелкните, чтобы просмотреть полноразмерное изображение)
Создание записей базы данных
Представление индекса, созданное в предыдущем разделе, содержит ссылку для создания записей базы данных. Давайте реализуем логику и создадим представление, необходимое для создания записей базы данных фильмов.
Контроллер Home содержит два метода с именем Create(). Первый метод Create() не имеет параметров. Эта перегрузка метода Create() используется для отображения HTML-формы для создания новой записи базы данных фильмов.
Второй метод Create() имеет параметр FormCollection. Эта перегрузка метода Create() вызывается, когда HTML-форма для создания нового фильма публикуется на сервере. Обратите внимание, что этот второй метод Create() имеет атрибут AcceptVerbs, который предотвращает вызов метода, если не выполняется операция HTTP Post.
Этот второй метод Create() был изменен в обновленном классе HomeController в листинге 4. Новая версия метода Create() принимает параметр Movie и содержит логику для вставки нового фильма в таблицу базы данных Movies.
Примечание
Обратите внимание на атрибут Bind. Так как мы не хотим обновлять свойство Movie Id из HTML-формы, необходимо явно исключить это свойство.
Листинг 4. Controllers\HomeController.vb (изменен метод 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_-->
Visual Studio упрощает создание формы для создания новой записи базы данных фильмов (см. рис. 12). Выполните следующие действия.
- Щелкните правой кнопкой мыши метод Create() в редакторе кода и выберите пункт меню Добавить представление.
- Убедитесь, что установлен флажок Создать строго типизированное представление .
- В раскрывающемся списке Просмотр содержимого выберите значение Создать.
- В раскрывающемся списке Просмотреть класс данных выберите значение MovieApp.Movie.
- Нажмите кнопку Добавить , чтобы создать новое представление.
Рис. 12. Добавление представления "Создать" (щелкните для просмотра полноразмерного изображения)
Visual Studio автоматически создает представление в листинге 5. Это представление содержит HTML-форму, содержащую поля, соответствующие каждому свойству класса Movie.
Листинг 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>
Примечание
Html-форма, созданная диалоговым окном Добавление представления, создает поле формы идентификатора. Так как столбец Id является столбцом Identity, это поле формы не требуется, и его можно безопасно удалить.
После добавления представления "Создать" в базу данных можно добавить новые записи фильмов. Запустите приложение, нажав клавишу F5, и щелкните ссылку Создать, чтобы увидеть форму на рисунке 13. Если заполнить и отправить форму, создается новая запись базы данных фильмов.
Обратите внимание, что проверка формы выполняется автоматически. Если вы не вводите дату выпуска для фильма или вводите недопустимую дату выпуска, форма будет переиграна, а поле даты выпуска выделено.
Рис. 13. Создание новой записи базы данных фильмов (щелкните для просмотра полноразмерного изображения)
Изменение существующих записей базы данных
В предыдущих разделах мы обсуждали, как получить список и создать новые записи базы данных. В этом заключительном разделе мы обсудим, как изменить существующие записи базы данных.
Во-первых, необходимо создать форму Правка. Это простой шаг, так как Visual Studio автоматически создаст форму редактирования. Откройте класс HomeController.vb в редакторе кода Visual Studio и выполните следующие действия.
- Щелкните правой кнопкой мыши метод Edit() в редакторе кода и выберите пункт меню Добавить представление (см. рис. 14).
- Установите флажок Создать строго типизированное представление.
- В раскрывающемся списке Просмотр содержимого выберите значение Изменить.
- В раскрывающемся списке Просмотреть класс данных выберите значение MovieApp.Movie.
- Нажмите кнопку Добавить , чтобы создать новое представление.
Выполнив эти действия, в папку Views\Home будет добавлено новое представление с именем Edit.aspx. Это представление содержит HTML-форму для редактирования записи фильма.
Рис. 14. Добавление представления правки (щелкните, чтобы просмотреть полноразмерное изображение)
Примечание
Представление Правка содержит поле формы HTML, соответствующее свойству Movie Id. Так как вы не хотите, чтобы пользователи изменяли значение свойства Id, необходимо удалить это поле формы.
Наконец, необходимо изменить контроллер Home, чтобы он поддерживал редактирование записи базы данных. Обновленный класс HomeController содержится в листинге 6.
Листинг 6. Controllers\HomeController.vb (изменить методы)
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
В листинге 6 я добавил дополнительную логику к обеим перегрузкам метода Edit(). Первый метод Edit() возвращает запись базы данных movie, соответствующую параметру Id, переданного методу . Вторая перегрузка выполняет обновление записи фильма в базе данных.
Обратите внимание, что необходимо получить исходный фильм, а затем вызвать Метод ApplyPropertyChanges(), чтобы обновить существующий фильм в базе данных.
Сводка
Цель этого руководства — дать вам представление о создании ASP.NET приложения MVC. Я надеюсь, что вы обнаружили, что создание веб-приложения ASP.NET MVC очень похоже на процесс создания приложения Active Server Pages или ASP.NET.
В этом руководстве мы рассмотрели только самые основные функции платформы ASP.NET MVC. В будущих руководствах мы более подробно рассмотрим такие темы, как контроллеры, действия контроллера, представления, просмотр данных и вспомогательные функции HTML.
Обратная связь
Ожидается в ближайшее время: в течение 2024 года мы постепенно откажемся от GitHub Issues как механизма обратной связи для контента и заменим его новой системой обратной связи. Дополнительные сведения см. в разделе https://aka.ms/ContentUserFeedback.
Отправить и просмотреть отзыв по