Перейти к содержанию

Пагинация «Show More» в Asp.Net

1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (1 оценок, среднее: 5,00 из 5)
Загрузка...

[ Полезный рекламный блок ]

Попробуйте свои силы в игре, где ваши навыки программирования на C# станут решающим фактором. Переходите по ссылке 🔰.


В этой статье, рассмотрим процесс построения пагинации в стиле «Показать еще» в проекте, который продемонстрирует совместное использование ASP.NET Core MVC и Entity Framework Core. Проект будет простым, но близким к реальности, приступим.

Создание и настройка проекта

Чтобы создать проект ShowMore, запустите Visual Studio и выберите в меню File (Файл) — New Project (Создать Проект). Укажите шаблон проекта ASP.NET Core Web Application (Веб-приложение ASP.NET Core). Введите ShowMore, в поле Name, на следующей странице укажите Framework .Net 7.0 и нажмите кнопку Create:

Конфигурация подключения

Для начала загрузим библиотеку Entity Framework Core Sql Server:

загрузка библиотеки Entity Framework Core Sql Serve

Или через Package Manager Console:

Перейдем в файл appsettings.json и пропишем конфигурацию подключения и логирования:

Строки подключения определяются в файле appsettings.json, в коде выше, представлено определение строки подключения для БД приложения GameStore. В проекте применяется версия LocalDB продукта SQL Server, которая спроектирована специально для разработчиков и не требует конфигурирования или учетных данных.

Создание класса контекста данных

В обеспечении доступа к данным в БД инфраструктура Entity Framework Core полагается на класс контекста БД. Чтобы снабдить пример приложения контекстом, добавьте папку Data, а в нее файл класса по имени ApplicationContext.cs со следующим кодом:

Класс контекста БД соответственно прост — хотя ситуация изменится с ростом сложности модели данных в ваших проектах.

Модель и Репозиторий

Модель для приложения Show будет основана на списке товаров. Создайте папку Models и добавьте в нее файл класса по имени Product.cs со следующим содержимым:

использованием паттерна «Хранилище» (Repository), в котором интерфейс определяет свойства и методы, предназначенные для доступа к данным, а для работы с механизмом хранения данных применяется класс реализации. Преимущество использования паттерна «Хранилище» связано с облегчением модульного тестирования части MVC приложения, а также с тем, что детали, касающиеся хранения данных, скрыты от остальных частей приложения.

Чтобы создать интерфейс хранилища, создайте папку Interfaces и добавьте в нее файл интерфейса по имени IProduct.cs со следующим содержимым:

Создайте папку Repository и добавьте в нее файл класса по имени ProductRepository.cs со следующим содержимым:

В приложении ASP.NET Core MVC, доступ к объектам контекста данных управляется с использованием внедрения зависимостей и потому в класс ProductRepository был добавлен конструктор, принимающий объект ApplicationContext, который будет предоставлен средством внедрения зависимостей во время выполнения.

Конфигурирование поставщика базы данных и класса контекста

Добавьте в класс Program.cs операторы конфигурации, чтобы сообщить инфраструктуре Entity Framework Core о том, каким образом использовать строку подключения, которую должен применять поставщик БД, и как управлять классом контекста:

Расширяющий метод AddDbContext<T>() применяется для настройки класса контекста, указывает инфраструктуре Entity Framework Core, какой поставщик БД использовать (в этом случае посредством метода UseSqlServer(), но для каждого поставщика БД предусмотрен свой метод), и предоставляет строку подключения.

Начальные данные

Нередко возникает необходимость, чтобы база данных к моменту первого обращения приложения уже содержала начальные данные, например, базовые роли и учетную запись администратора. 

Для инициализации базы данных начальными ролями и пользователями, в папке Data, определим класс DbInit, со следующим содержимым:

Используем данный класс, в классе Program после var app = builder.Build();:

Здесь с помощью метода services.GetRequiredService() получаем сервис ApplicationContext и передаем их его метод InitializeAsync. В итоге при первом запуске в базу данных будут добавлены все необходимые данные.

Запустим приложение и проверим, чтобы база данных успешно создалась, а таблицы с ролями и пользователями были заполнены:

asp.net localdb

 

Уважаемые энтузиасты программирования на C#!

Мы понимаем, что иногда вы можете столкнуться с трудностями при решении проблем во время работы над своими проектами на C#. Если у вас возникли проблемы, связанные с языком программирования C#, мы готовы вам помочь!
https://dijix.com.ua/blog помощь
Вы можете связаться с нами по электронной почте или позвонить нам по телефону. Наша команда опытных разработчиков C# будет рада помочь вам с любыми вопросами или проблемами, которые у вас могут возникнуть. Мы стремимся помочь вам преодолеть любые препятствия, с которыми вы столкнетесь на пути освоения C#.
Не стесняйтесь обращаться к нам за любой помощью или руководством. Мы всегда готовы поддержать вас в ваших начинаниях.

С наилучшими пожеланиями,
[Леонид / Dijix Company]

info@dijix.com.ua
+380970601478

 

Контроллер и представления

Перейдем в контроллер Home и определим в нем следующий код:

Поскольку информации о продукте не мало, вынесем его в отдельное представление. Перейдем в папку Views / Shared и добавим частичное представление _ProductPartial.cshtml, со следующим содержимым:

Перейдем в представление Views / Home / Index.cshtml и определим в нем следующее содержимое:

Страница отображает начальный список продуктов. При нажатии на кнопку «Show more», срабатывает JavaScript код, с помощью которого отправляется запрос по адресу «/get-more-products?page=» + page + «&pageSize», в ответ на данный запрос мы получаем частичное представление с данными о товарах, которое успешно добавляем в основной блок на страницу.

Перейдем в папку Views / Shared и добавим частичное представление _ProductsPartial.cshtml, со следующим содержимым:

С помощью данного представления мы сможем поставлять определенное количество продуктов в основную страницу. Запустим проект и проверим его работу.

Я надеюсь, что вам понравилось читать эту статью, и она оказалась легкой для понимания. Пожалуйста, дайте мне знать, если у вас есть какие-либо комментарии или исправления.

Так же вам может быть интересна предыдущая статья — Создание приложения с использованием ASP.NET Core MVC и EF Core.


Вы хотите научится писать код на языке программирования C#?

Создавать различные информационные системы, состоящие из сайтов, мобильных клиентов, десктопных приложений, телеграмм-ботов и т.д.

Переходите к нам на страницу Dijix и ознакомьтесь с условиями обучения, мы специализируемся только на индивидуальных занятиях, как для начинающих, так и для более продвинутых программистов. Вы можете взять как одно занятие для проработки интересующего Вас вопроса, так и несколько, для более плотной работы. Благодаря личному кабинету, каждый студент повысит качество своего обучения, в вашем распоряжении:

  • Доступ к пройденному материалу
  • Тематические статьи
  • Библиотека книг
  • Онлайн тестирование
  • Общение в закрытых группах

https://dijix.com.ua

Живи в своем мире, программируй в нашем.


 

Опубликовано в рубрикеAsp.Net Core
Подписаться
Уведомить о
guest
0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии
0
Оставьте комментарий! Напишите, что думаете по поводу статьи.x