Tech Seeker

In this article, we are going to implement pagination using angular material in a sample angular(version 12) application. Create A Sample Angular Application: Let's create a sample angular project and also install the angular material package. Install Angular CLI: npm install -g @angular/cli Command To Create Angular Application: ng new your-project-name Command To Install Angular Material Package: ng add @angular/material API: Here I'm going to use a sample pagination API that I had created. Here I will show the sample response to gain the basic idea over the API. Create Response Models: Now let's create models to read the API JSON response. ng g class models/todo.model ng g class models/todo.paging.model models/todo.model.ts: export interface TodoModel { id:number; itemName: string; isCompleted:boolean; } models/todo.paging.model.ts: import { TodoModel } from "./todo.model"; export interface TodoPagingModel { data: TodoModel[], totalC

In this article, we are going to implement pagination in the Blazor WebAssembly application using the MudBlazor UI table component. Pagination API: To accomplish our demo we need an API endpoint that contains a payload to support the pagination. If you have good knowledge of API pagination you can create your own API or else I have already created a blog on API pagination, so  click here  to know more. Create A Blazor WebAssembly Project: Let's begin our coding by creating a sample Blazor WebAssembly project. Steps To Configure MudBlazor: Let's install the 'MudBlazor' NuGet into our sample project. Now add the MudBlazor namespace into the '_Import.razor' file. _Import.razor: @using MudBlazor Add the below CSS files inside of the head tag of the 'index.html'. wwwroot/index.html: <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" /> <link href="_content

In this article, we are going to implement a sample demo on pagination in .Net5 Web API application using Dapper ORM for database communication. Create A Sample Table: To accomplish our demo let's create a sample table. CREATE TABLE [dbo].[Todo]( [Id] [int] IDENTITY(1,1) NOT NULL, [ItemName] [varchar](max) NULL, [IsCompleted] [bit] NOT NULL CONSTRAINT Pk_Todo PRIMARY KEY (Id) ) Create A .Net5 Web API Application: Let's create a .Net5 Web API application to implement our pagination. Specify the project name and solution name Select target framework a .Net5 Create Table Model and Pagination Response Model: Now we need to create to models like 'Todo'(Table Class) and 'PagingResponseModel'(Class that  used as API response model which contains all pagination properties). So let's add a new folder like 'Models' and our 2 classes inside of it. Models/Todo.cs: namespace Dot5.API.Dapper.Pagging.Models { public class Todo { public