Front-End Pagination With JavaScript

In this video we will be using Javascript to perform frontend pagination on a table of data that we rendered out using Javascript and JSON data.
We will start by creating some basic pagination first, then we'll add a rolling window affect to handle larger sets of data.
Follow me on Twitter: / dennisivy11
Linkedin: / dennis-ivanov
Source code + jsfiddle.net/i...

[@hammadhassan3085]

Works accurately and plus point is you have demonstrated modern pagination style.

[@qirele8773]

Thank you so much! Had a horrible time figuring out how to paginate a large amount of data for a school project, this really helped a lot!

[@kanways8]

It's really usefull. Only video that teach advanced pagination

[@匿名-x5m]

Nice tutorial, but I still have doubts. While this implementation is working as expected in the frontend, the backend is still sending out large data. For example, if a user sends a request, it fetches 20,000 data. The user retrieves all these data, then the JavaScript performs its operation in the user end as shown in this video. Isn't it still defeats the purpose of pagination? Since the server side is still sending out large data (which can also lead to DDoS and higher memory consumption). Please correct me if I'm wrong.

[@jeremey2072]

Should be labeled "Front-End Pagination with jQuery" instead of "with JavaScript"

[@AQW9111]

Thank you very much! A very simple but still complex solution!

[@henokkebede689]

I appreciate your help man. Thank you!

[@user-pk2pj8bt6t]

How should I change the javascript to show the active button?

[@ritaanene6414]

this video really helped me a lot. Thanks

[@nguyenngochai3049]

thank you so much, this just saves my day

[@lilialobato2611]

thanks! really easy to understand and really usefull!!!

[@pushpakfegade2770]

Can you give coded lines as jQuery into javascript syntax.

[@pushpakfegade2770]

I need the jquery syntax into Vanilla javascript can anyone provide it.

[@benjaminch6292]

Thanks so much! I love it

[@samrey8134]

you bet me to it by 4 weeks.

[@joux1992]

Thank you very much for this video.

[@ernestzavier2377]

a tip: you can watch series on Flixzone. I've been using it for watching lots of of movies these days.

[@kadedane5329]

@Ernest Zavier yup, been watching on Flixzone for years myself :D

[@naveenjoe892]

Awesome work thanks! love it.

[@suli5293]

Amazing tutorial and an amazing coder, but I just wished if you started this from scratch so we can follow up

[@imaby.k]

how to add searching with this pagination...please help

[@rockstar007cool]

Yess, dennis there is a video of yours in which you explained searching and here pagination.
If you could create a video to do both together.
Need to implement asap.
And thanks your videos helps a lot.

[@spitfire7914]

I need to make a project which gets data by searching via github api and then paginates those data.

[@jhalakmaheshwari234]

This is amazing! Thank You :)

[@mrmufy]

Thanks.
Can u tell me how i can set the current page with the active status highlight.

[@joux1992]

if you want set the current page you can try this in the pageButtons function
if (state.page == page) {
wrapper.append(`
${page}`);
} else {
wrapper.append(`${page}`);
}

[@AntonyAllocious]

@@joux1992 I tried my end, am not able to succeed, can you share your code. Thanks in advance

[@aacm1259]

@@AntonyAllocious you need to put that IF where you create the buttons instead of what he had in the video, like this:
for(var page = maxLeft; page

[@nahida4444]

can anybody please tell me if that jquery bit can be written in javascript? i m stuck with the onclick function

[@pushpakfegade2770]

i too want that did u get the current value of page i.e this.val() into javascript

[@dsadsa5008]

thanks for video !! i love it

[@yusufsAnt31]

Thanks

[@paulohsgoes1959]

Excellent job!

[@DiegoSantos-wo6rb]

THANK YOU!

[@ibrahimjomaa6548]

thx for all♥

[@karlrussellmenil9460]

Topic: Full stack javascript - Data Pagination and Filtering
Good day,
If I may humbly ask a little help, any hints, comments and suggestions are very much welcome, thank you in advance for all your help, please see question below, how do I code this?:
/*
Create the `showPage` function
This function will create and insert/append the elements needed to display a "page" of nine students
*/
/*
Create the `addPagination` function
This function will create and insert/append the elements needed for the pagination buttons
*/
// Call functions

[@bikramchettri9405]

thanks for the video.

[@DennisIvy]

My pleasure, thank you for watching :)

[@joedlopez2214]

Thankyou Very Much !!

[@peteryu4353]

Can I use API with this?

[@aguyoninternet9883]

awesome dude!!

[@lsagar]

thank you very much

[@noorrida8895]

Thanks a ton!

[@bagasmendo4959]

THANKSSS BROOO, A LOT

[@i-am-oi]

Ivy could you please make another using just the arrow icons. Thanks

[@DennisIvy]

I purposely didn't use arrow functions because I know a lot of people watching this still use the old JavaScript functions but I could do that. How about I re-write the code with arrow functions and attach it as another git repository. Would that help you?

[@i-am-oi]

@@DennisIvy Sure, it'd definitely help. Thanks

[@user-gd7re8pj6m]

Thanks for video
how to do active page button?

[@Jagadish47]

I dont understand the code

[@pazhyloiandkulg4wiystudios830]

THANKS THANKS THANKS THANKS!!!!!!!!!

[@giantqtipz6577]

youre welcome bro

[@moody54324]

Do it with django api instead json variable.

[@Pareshbpatel]

{2021-09-07}

[@preeeby]

Thanks

[@DennisIvy]

My pleasure :)