Создание web-приложения

2016-01-05

400

Обсуждений (0)

0.00 из 5.00 0 оценок

⇐ Предыдущая 12

Перед началом создания приложения необходимо добавить ссылки на проект ShopModel и на библиотеку Entity Framework версии 4.0. Также необходимо добавить в файл Web.config строку подключения к базе данных.

<add name="ApplicationServices"

connectionString="data source=.\SQLEXPRESS;Integrated Security=SSPI;

AttachDBFilename=|DataDirectory|aspnetdb.mdf;User Instance=true"

providerName="System.Data.SqlClient" />

<add name="GiftShopEntities" connectionString="metadata=res:

//*/Entities.ShopEntity.csdl|res://*/Entities.ShopEntity.ssdl|

res://*/Entities.ShopEntity.msl;provider=System.Data.SqlClient;provider connection string="

Data Source=.\SQLEXPRESS;Initial Catalog=GiftShop;Integrated Security=True;

Pooling=False;MultipleActiveResultSets=True"" providerName="System.Data.EntityClient" />

</connectionStrings>

Так, как в нашем проекте используется MVC 3 , нам необходимо удалить ненужные объекты из шаблона начального проекта. После этого приступим к созданию контроллеров. Для этого щелкаем правой кнопкой на папке Controller, выбираем AddController , задаём ему имя ProductController. Этот контроллер будет отвечать за работу с товарами на сайте. Для этого создаем ViewList, в котором будут выводиться наши товары.

Теперь необходимо зарегистрировать маршрут в файле Global.asax.

Public static void Register Routes(RouteCollectionroutes) {

routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute(

"Default", // Route name

"{controller}/{action}/{id}", // URL with parameters

new { controller = "Product", action = "List", id = UrlParameter.Optional }

);

}

Для того чтобы товары отображались на странице не все, а по несколько штук добавим в папку Models класс PagingInfo. А также необходимо создать HTML Helper Method. Для этого создадим папку HtmlHelpers и добавим в неё новый статический класс PagingHelpers. Создадим в нём расширяющий метод PageLinks, который будет выполнять на странице разбиение. Добавим ссылку на HTML Helper Method в Views/Web.config File.

Создаём в папке Models класс ProductsListViewMode, который объединяет PagingInfoи List. Добавляем в Global.asax новый маршрут. Создадим новую Partial View Product Summary, в котором будет выводиться имя товара, его описание и цена. И теперь добавим в List следующий код:

@modelSportsStore.WebUI.Models.ProductsListViewModel

ViewBag.Title = "Products";

}

@foreach (var p in Model.Products) {

Html.RenderPartial("ProductSummary", p);

}

@Html.PageLinks(Model.PagingInfo, x =>Url.Action("List", new {page = x}))

</div>

Теперь несколько изменим дизайн нашего сайта. В папке Content выберем файл Site.css, удалим в нём содержимое и вставим:

BODY { font-family: Cambria, Georgia, "Times New Roman"; margin: 0; }

DIV#headerDIV.title, DIV.item H3, DIV.item H4, DIV.pager A {

font: bold 1em "Arial Narrow", "Franklin Gothic Medium", Arial;

}

DIV#header{ background-color: #444; border-bottom: 2px solid #111; color: White; }

DIV#headerDIV.title{ font-size: 2em; padding: .6em; }

DIV#content{ border-left: 2px solid gray; margin-left: 9em; padding: 1em; }

DIV#categories{ float: left; width: 8em; padding: .3em; }

DIV.item{ border-top: 1px dotted gray; padding-top: .7em; margin-bottom: .7em; }

DIV.item:first-child { border-top:none; padding-top: 0; }

DIV.item H3 { font-size: 1.3em; margin: 0 0 .25em 0; }

DIV.item H4 { font-size: 1.1em; margin:.4em 0 0 0; }

DIV.pager{ text-align:right; border-top: 2px solid silver;

padding: .5em 0 0 0; margin-top: 1em; }

DIV.pager A { font-size: 1.1em; color: #666; text-decoration: none;

padding: 0 .4em 0 .4em; }

DIV.pager A:hover { background-color: Silver; }

DIV.pagerA.selected{ background-color: #353535; color: White; }

При добавлении новых компонент на страницы это код будем обновлять, добавлять что-то новое. Теперь изменим наш DefaultRazorLayout. Поместим в body следующий код:

<body>

<div class="title">МагазинПодарков</div>

</div>

@{Html.RenderAction("Menu", "Nav"); }

</div>

@RenderBody()

</div>

</body>

</html>

Теперь необходимо создать новый контроллер NavController, который будет работать с категориями товаров. Фактически, он будет определять страницы нашего приложения. Зарегистрируем в файле Global.asax маршруты для этого контроллера. В классе NavController создадим Partial View Result Menu(), которая будет отображать категории на странице. Для этого в Partial View Result Menu используем Html.ActionLink и Html.RouteLink. Добавим в Site.css описание для категорий.

Далее перейдём к разработке корзины покупателя. Для этого зайдём в проект ShopModel и в папке Entities создадим класс DataCartManager, который будет работать с корзиной [3, с. 187].

Далее необходимо создать CartController, который будет управлять ею. Следующим шагом будет создание в папке Models класса CartIndexViewModel, который будет позволять возвращаться от корзины к List. В CartControllers создаётся метод ViewResultIndex. Потом создаётся ViewIndex, который будет отображать корзину, см. рис. 2.2.

Рис.2.2. Интерфейс корзины покупателя

Источник: собственная разработка автора при помощи Microsoft Visual Studio

Далее добавим возможность удаление товаров из корзины. Следующим шагом будет покупка товаром из корзины (Checkout), создаём модель подтверждения заказа и регистрируем заказ в базу данных.

И последней частью данного приложения будет AdministrationPart, здесь мы реализуем возможность CRUD операций. Для этого создадим AdminController, у него будет свой layout, свой CSSstyles. Работа контроллера демонстрируется в приложении.

ЗАКЛЮЧЕНИЕ

В курсовой работе было продемонстрировано создание интернет - магазина «Подарки», с помощью технологии ASP.NETMVC 3. Эта технология MVC 3 является совершенно новой, отличающейся от всех своих предшественников по созданию Web-страниц. Все преимущества были продемонстрированы в ходе создания проекта.

2016-01-05

400

Обсуждений (0)

0.00 из 5.00 0 оценок

⇐ Предыдущая 12

Обсуждение в статье: Создание web-приложения

Обсуждений еще не было, будьте первым... ↓↓↓