830 likes | 857 Views
Controller. View. Model. ASP.NET MVC. 2010. Web- фреймворки на основі архітектури MVC Підтримка ASP.NET MVC -проектування у MS Visual Studio . Маршрутизація в ASP.NET MVC -проектах
E N D
Controller View Model ASP.NET MVC 2010
Web-фреймворки на основі архітектури MVC Підтримка ASP.NET MVC-проектування у MS Visual Studio. Маршрутизація в ASP.NET MVC-проектах Приклад розробки проекту із використанням стратегії “від моделі” . Entity Framework як ORM-framework. Моделі, таблиці, класи в Entity Framework Контролери в ASP.NET MVC-проектах. Майстри генерації View для операцій перегляду, редагування, створення та вилучення даних Засади валідації в ASP.NET MVC-проектах. Використання partial-класів та метаданихНенав’язлива (Unobtrusive) Java-script валідація Зміст ASP.NET MVC - 2010
Web-фреймворки на основі архітектури MVC http-запит View («web-сторінка») html-сторінка Диспетчер Controller Engine Mapping Model ІнодіView може бути простоhtml-сторінкою Mapping: URL-адреса --> Controller ASP.NET MVC - 2010
Web-фреймворки на основі архітектури MVC Controller View Model Model – об’єкти, починаючи від бізнес-логіки і до логіки підтримки роботи з БД; View – інтерфейс (орієнтований на використання людиною); Controller – логіка взаємодії (між View та Model) у процесі отримання за запитом відпо-віді та підготовки до її відображення http-запит View («web-сторінка») html-сторінка Диспетчер Controller Engine Використовує ІнодіView може бути простоhtml-сторінкою Mapping Model Mapping: URL-адреса --> Controller ASP.NET MVC - 2010
ASP NET MVC Framework Використання архітектури MVC надає технології ASP NET MVC такі важливі риси як ефективність та акуратність Controller View Model http-запит View («web-сторінка») html-сторінка Диспетчер Controller Engine • Диспетчер – має назву “маршрутизатор”; • Mapping – сукупність “маршрутів”. Окремий “маршрут” деяким варіантам URL-адрес ставить у відповідність дію (action) – метод “контроллер-класу” • View асоціюється з деякими варіантами web-сторінок: • aspx-сторінки; • razor-сторінки (файли з розширенням cshtml). Mapping Model ASP NET MVC: Можуть використовуватись й інші варіанти у відповідності до наявних Engine. ASP.NET MVC - 2010
ASP.NET MVC-проекти. Використання майстра у MS Visual Studio ASP.NET MVC - 2010
Налаштування проекту-заготівки (шаблонного проекту) ASP.NET MVC - 2010
Робота з шаблонним проектом (1/2) ASP.NET MVC - 2010
Робота з шаблонним проектом (2/2) ASP.NET MVC - 2010
Структура шаблонного проекту. Угоди про каталоги, імена, ще один mapping (action -> view) Визначається mapping -угодою Обов’язкові каталоги Обов’язковий суфікс Структура ката-логів визнача-ється угодою Визначається mapping -угодою ASP.NET MVC - 2010 Файл HomeController.cs
Маршрутизація. (Файл Global.asax) (1/2) Можна: • додавати нові маршрути; • забороняти (ігнорувати) маршрути; • задавати обмеження. Файл Global.asax (фрагмент) ASP.NET MVC - 2010
Маршрутизація. (Файл Global.asax) (2/2) Файл Global.asax ASP.NET MVC - 2010
Приклад маршрутизації. (Шаблонний проект. Файл HomeController.cs ) ASP.NET MVC - 2010
Маршрутизація у розширеному проекті ”Mvc3_Students” (1/2) ASP.NET MVC - 2010
Маршрутизація у розширеному проекті ”Mvc3_Students” (2/2) action = “Index” (за замовуванням) Файл Global.asax (фрагмент) ASP.NET MVC - 2010
Розширений проект ”Mvc3_Students”. Використання стратегії розробки “від моделі” EDM– Entity Data Model Ім’я моделі ASP.NET MVC - 2010
Створення порожньої моделі та додавання сутності.(Entity Data Model, EDM) ASP.NET MVC - 2010
Сутність (entity) Student ASP.NET MVC - 2010
Запуск майстра створення бази даних за моделлю ASP.NET MVC - 2010
Діалогові вікна майстра створення БД (1/4) ASP.NET MVC - 2010
Діалогові вікна майстра створення БД (2/4) Установлення підключення до БД ASP.NET MVC - 2010
Діалогові вікна майстра створення БД (3/4) DDL-код ASP.NET MVC - 2010
Діалогові вікна майстра створення БД (4/4) Запуск скрипта ASP.NET MVC - 2010
Виконання SQL-скрипта (вимагає під’єднання до БД) Зауваження. SQL ServerCompact Edition – не дуже вдалий інструментарій для нашої задачі (наявні проблеми з Identity, що мав би забезпечувати підтримку автоматичної генерації ключів – див. слайд “Сутність (entity) Student”) ASP.NET MVC - 2010
Entity Framework. Моделі, таблиці, класи Model - ім’я нашої моделі ASP.NET MVC - 2010
Таблиця Students. Наповнення таблиці ASP.NET MVC - 2010
Файл Model.Designer.cs (фрагменти) ModelContainer, Student – два класи, згенеровані Emptity Framework (ORM-фреймворком) Model – обране ім’я для нашої моделі ASP.NET MVC - 2010
Контролери. Вікно майстра генерації контролера ! ASP.NET MVC - 2010
Файл StudController.cs(згенерований майстром) using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; namespace Mvc3_Students.Controllers { public class StudController : Controller { // // GET: /Stud/ public ActionResult Index() { return View(); } // // GET: /Stud/Details/5 public ActionResult Details(int id) { return View(); } // // GET: /Stud/Create public ActionResult Create() { return View(); } . . . ASP.NET MVC - 2010
Дії (методи Action) контролерів publicActionResult Details(int id) { return View(); } Від ActionResult успадковуються: • ViewResult; //для задання View • EmptyResult; • RedirectResult; //для перенаправлення "на інший URL" • JsonResult; • ContentResult; //для задання тексту • FileContentResult; • . . . ASP.NET MVC - 2010
Дії (методи Action) контролерів. Приклад // GET: /Stud/Details/5 publicActionResult Details(int id) // Варіант 1 { var ctx = new Mvc3_Students.Models.ModelContainer(); return View(ctx.Students.SingleOrDefault(st => st.Id == id)); } StudController // GET: /Stud/Details/5 publicActionResult Details(int id) // Варіант 2 { var ctx = new Mvc3_Students.Models.ModelContainer(); ViewData.Model = ctx.Students.SingleOrDefault(st => st.Id == id); return View(); } StudController ASP.NET MVC - 2010
Файл StudController.cs . Реалізація дії (action) Index. Генерація (додавання) View Ім’я моделі ModelContainer – контейнерний клас, згене-рований Emptity Framework (ORM-фреймворком) ПКМ в межах Action ASP.NET MVC - 2010
Вікно майстра генерація View (для ActionIndex) Створення View (Index.cshtml) ! ASP.NET MVC - 2010
Файл Views\Stud\Index.cshtml(view, згенерований майстром ) @model IEnumerable<Mvc3_Students.Models.Student> @{ ViewBag.Title = "Index"; } <h2>Index</h2> <p> @Html.ActionLink("Create New", "Create") </p> <table> <tr> <th></th> <th> Name </th> <th> Course </th> </tr> @foreach (var item in Model) { <tr> <td> @Html.ActionLink("Edit", "Edit", new { id=item.Id }) | @Html.ActionLink("Details", "Details", new { id=item.Id })| @Html.ActionLink("Delete", "Delete", new { id=item.Id }) </td> <td> @item.Name </td> <td> @item.Course </td> </tr> } </table> Фрагмент веб-сторінки у браузері ASP.NET MVC - 2010 Index.cshtml
Зміни у шаблоні_Layout.cshtml Змінено Додано ASP.NET MVC - 2010
Поточний стан розробки проекту СторінкаIndex ASP.NET MVC - 2010
Details (action, view) Action Створення View (Details.cshtml) ! СторінкаDetails ASP.NET MVC - 2010
Файл Details.cshtml– view(допрацьована україномовна версія сторінки) ASP.NET MVC - 2010
Зауваження до маршрутизації та реалізації Action-методів (1/2) Перегляд HTML-коду сторінки (у браузері) ASP.NET MVC - 2010
Зауваження до маршрутизації та реалізації Action-методів (2/2) Перегляд HTML-коду сторінки (у браузері) ASP.NET MVC - 2010
До реалізації Create View, як інтерфейс, для обох запитів може бути обраний один, але ці запитии потребують різної обробки (зауважимо, що один з них є HttGet-запитом, а інший – запитом HttPost). /Stud/Create ASP.NET MVC - 2010
Два Action-методи Create // GET: /Stud/Create publicActionResult Create() { return View(newStudent()); } // POST: /Stud/Create [HttpPost] publicActionResult Create(Student stToAdd) { if (!ModelState.IsValid) return View(stToAdd); var ctx = newModelContainer(); ctx.AddToStudents(stToAdd); ctx.SaveChanges(); return RedirectToAction("Index"); } ASP.NET MVC - 2010
Create. Створення View Створення View (Create.cshtml) СторінкаCreate ! ASP.NET MVC - 2010
Файл Create.cshtml У проекті використано спрощений підхід до маніпулювання ключами Id @model Mvc3_Students.Models.Student @{ ViewBag.Title = "Create"; } <h2>Create</h2> <scriptsrc="@Url.Content("~/Scripts/jquery.validate.min.js")"type="text/javascript"></script> <scriptsrc="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"type="text/javascript"></script> @using (Html.BeginForm()) { @Html.ValidationSummary(true) <fieldset> <legend>Student</legend> <divclass="editor-label"> @Html.LabelFor(model => model.Name) </div> <divclass="editor-field"> @Html.EditorFor(model => model.Name) @Html.ValidationMessageFor(model => model.Name) @*. . . Course *@ </div> <p><inputtype="submit"value="Create"/></p> </fieldset> } <div> @Html.ActionLink("Back to List", "Index") </div> <divclass="editor-label"> @Html.LabelFor(model => model.Id) </div> <divclass="editor-field"> @Html.EditorFor(model => model.Id) @Html.ValidationMessageFor(model => model.Id) </div> Додано для Id Name- фрагмент Подібний Course-фрагмент ASP.NET MVC - 2010
Два Action-методи Edit // GET: /Stud/Edit/5 [HttpGet] publicActionResult Edit(int id) { var ctx = new Mvc3_Students.Models.ModelContainer(); return View(ctx.Students.Single(x => x.Id == id)); } // POST: /Stud/Edit/5 publicActionResult Edit(Student student) { if (!ModelState.IsValid) return View(student); var ctx = new Mvc3_Students.Models.ModelContainer(); var studOld = ctx.Students.Single(s => s.Id == student.Id); studOld.Course = student.Course; studOld.Name = student.Name; ctx.SaveChanges(); return RedirectToAction("Index"); } Використовується форма (View) для редагування ASP.NET MVC - 2010
Edit . Створення View Створення View (Edit.cshtml) СторінкаEdit ! ASP.NET MVC - 2010
Delete. Два Action-методи Використовується форма (View) для перегляду і підтвердження // GET: /Stud/Delete/5 publicActionResult Delete(int id) { var ctx = new Mvc3_Students.Models.ModelContainer(); return View(ctx.Students.Single(x => x.Id == id)); } // POST: /Stud/Delete/5 [HttpPost] publicActionResult Delete(Student student) { try { var ctx = new Mvc3_Students.Models.ModelContainer(); var stud = ctx.Students.Single(s => s.Id == student.Id); ctx.DeleteObject(stud); ctx.SaveChanges(); return RedirectToAction("Index"); } catch { return View(); } } ASP.NET MVC - 2010
Delete. Створення View Створення View (Delete.cshtml) СторінкаDelete ! ASP.NET MVC - 2010
Специфіка проектів з SQL Server Compact Edition Потрібно додати! ASP.NET MVC - 2010
Валідація. Сторінка Log On (1/3) Сторінка Log On шаблонного проекту ASP.NET MVC - 2010