1 00:00:00,470 --> 00:00:00,990 Nice. 2 00:00:01,010 --> 00:00:07,910 And once we have discussed limit and skip, now we'll see how we can implement them to set up the pagination. 3 00:00:08,330 --> 00:00:14,720 And in this case, I'm not going to be looking for those values in Rugaru, meaning I'm not going to 4 00:00:14,720 --> 00:00:18,080 structure them because we'll set up the variables with the same name. 5 00:00:18,110 --> 00:00:25,550 So I think it's just going to be easier if we'll go with a query and line the page as well as the limit 6 00:00:25,770 --> 00:00:26,640 and all that. 7 00:00:26,900 --> 00:00:28,510 So let's just scroll down again. 8 00:00:28,550 --> 00:00:35,240 We're working right now in get all products on like this one smaller and we'll keep on scrolling, keep 9 00:00:35,240 --> 00:00:35,780 on scrolling. 10 00:00:36,020 --> 00:00:40,190 And then right after the fields, we want to set up three values. 11 00:00:40,430 --> 00:00:43,250 We want to go here with Consed and Page. 12 00:00:43,460 --> 00:00:48,550 So this is what the user is going to pass in, same as they have here. 13 00:00:48,980 --> 00:00:52,810 Notice we go with Page and then we just set up the page number. 14 00:00:53,240 --> 00:00:59,300 Now, by default, I do want to set up where we get the first page and that's why you go here with Page 15 00:00:59,480 --> 00:01:06,650 and then remember, whatever is coming from the red dot query actually is a string and I can just save 16 00:01:06,650 --> 00:01:07,120 some time. 17 00:01:07,370 --> 00:01:13,760 I'm not going to log because we did the console logs before and now this page is actually two. 18 00:01:14,060 --> 00:01:14,510 Correct. 19 00:01:14,660 --> 00:01:16,340 But it is a string of two. 20 00:01:16,670 --> 00:01:20,740 So of course before we do anything, we need to turn it into a number. 21 00:01:21,050 --> 00:01:26,840 So let me scroll back down and then I'll do the same thing over here where I scroll to the page and 22 00:01:26,840 --> 00:01:32,210 then we'll start with the number and then I'll say that I'm going to be looking for work query. 23 00:01:33,070 --> 00:01:34,060 And then the page. 24 00:01:34,330 --> 00:01:41,020 Now, if the user doesn't pass the value, then I'll simply use the operator and I'm just going to say 25 00:01:41,020 --> 00:01:42,940 that it is going to be equal to one. 26 00:01:43,360 --> 00:01:45,320 And the same is going to be for the limit. 27 00:01:45,670 --> 00:01:51,230 I'll say that, yes, in the query there might be a limit since again, it's going to be a number. 28 00:01:51,250 --> 00:01:57,250 I need to use this number, meaning since I want this to be a number, but it's going to be a string, 29 00:01:57,250 --> 00:02:03,520 we need to go with number and then we pass in Iraq, query and then limit. 30 00:02:03,940 --> 00:02:07,870 And if no limit is passed, then we go with them. 31 00:02:08,050 --> 00:02:13,990 That's why in a complete project, you'll see this one where by default, essentially we're just getting 32 00:02:13,990 --> 00:02:15,330 back 10 product. 33 00:02:15,910 --> 00:02:17,890 Hopefully we are clear on this one. 34 00:02:18,160 --> 00:02:21,960 So if the value is past, then awesome, we'll use this value. 35 00:02:22,180 --> 00:02:24,190 If not, then we have some defaults. 36 00:02:24,490 --> 00:02:26,860 And now, of course, we just want to set up the logic. 37 00:02:27,720 --> 00:02:35,590 And the way we set up the logic, we go here with const skip and that is equal to page minus one, and 38 00:02:35,630 --> 00:02:42,180 then we multiply this parliament and I'll show you with actual comment example just so we are on the 39 00:02:42,180 --> 00:02:42,820 same page. 40 00:02:43,110 --> 00:02:44,310 So I'll set up the skip. 41 00:02:44,550 --> 00:02:49,740 And now, of course, I just want to change the skip and limit to my result. 42 00:02:49,890 --> 00:02:51,880 Remember, we're still working on the result. 43 00:02:52,140 --> 00:02:59,520 So once you have all of this functionality in place, then we'll simply go with a result is equal to 44 00:02:59,730 --> 00:03:06,330 and then we go with a result and then we change the skip, we pass in the skip variable and then we 45 00:03:06,330 --> 00:03:07,200 change limit. 46 00:03:07,500 --> 00:03:10,290 And of course we pass in the element variable. 47 00:03:10,800 --> 00:03:14,250 Now it's going to be kind of hard to see in our response. 48 00:03:14,260 --> 00:03:15,900 So let me just set up some comments. 49 00:03:16,140 --> 00:03:18,060 Just understand how everything works. 50 00:03:18,390 --> 00:03:21,620 So at the moment we have twenty three products. 51 00:03:21,630 --> 00:03:22,180 Correct. 52 00:03:22,530 --> 00:03:30,480 So if I decide to limit my response to only seven items, how many pages I have while we need to divide 53 00:03:30,480 --> 00:03:34,470 twenty three by seven, and effectively we will have four pages. 54 00:03:34,740 --> 00:03:37,400 So I have seven seven seven. 55 00:03:37,410 --> 00:03:38,610 So that's going to be twenty one. 56 00:03:38,970 --> 00:03:43,230 And then the last page actually is going to have only two items. 57 00:03:43,540 --> 00:03:45,380 So we have total four pages. 58 00:03:45,840 --> 00:03:52,210 And the way the logic works is following where the user will pass in some kind of value. 59 00:03:52,650 --> 00:03:58,410 So maybe for the page is going to go for two because remember, by default it's always going to be one. 60 00:03:58,770 --> 00:04:02,540 And then we multiply this by the limit. 61 00:04:02,790 --> 00:04:04,150 That's the key over here. 62 00:04:04,590 --> 00:04:11,940 So if we just have a default page or have one subtracted by one, of course, that is going to be zero 63 00:04:12,180 --> 00:04:14,640 and then multiplied by the limit. 64 00:04:14,830 --> 00:04:15,770 Still going to be zero. 65 00:04:16,019 --> 00:04:22,140 So effectively we'll skip zero items and then we'll just limit our response to seven. 66 00:04:22,480 --> 00:04:29,640 However, if the user is going to be looking for a second page, then of course we'll have to minus 67 00:04:29,640 --> 00:04:29,950 one. 68 00:04:30,210 --> 00:04:31,740 So have while you have one. 69 00:04:31,980 --> 00:04:33,750 And that is multiplied by the limit. 70 00:04:34,140 --> 00:04:42,450 So in this case, since I'm looking for page number two, I'll skip seven over here and then I'll have 71 00:04:42,450 --> 00:04:43,690 the limit of seven. 72 00:04:43,710 --> 00:04:47,580 So that's how I can see the second page and not showcase that. 73 00:04:47,910 --> 00:04:55,230 Let me just go to the static one and I want to get all the items just so you can see or hear. 74 00:04:55,560 --> 00:05:04,800 And I think I'll keep this as name and price like so and I'll sort this based on name and then let's 75 00:05:04,800 --> 00:05:05,940 do the same thing here. 76 00:05:06,060 --> 00:05:07,140 So let me send it. 77 00:05:07,500 --> 00:05:09,750 This is my entire list. 78 00:05:10,200 --> 00:05:17,340 And then if I go to all the product now, let me set it up everything correctly where I do want to still 79 00:05:17,340 --> 00:05:25,350 sort and I actually want to start, I guess, with a name and I'm going to remove the price. 80 00:05:25,560 --> 00:05:26,910 I don't really care about that. 81 00:05:27,150 --> 00:05:27,990 I think so. 82 00:05:28,350 --> 00:05:30,320 I mean, just double check. 83 00:05:30,660 --> 00:05:31,520 So select. 84 00:05:31,530 --> 00:05:31,830 Yeah. 85 00:05:31,950 --> 00:05:33,690 So I'm only sorting by the name. 86 00:05:34,170 --> 00:05:35,310 So let's see, let's see. 87 00:05:35,320 --> 00:05:42,330 So we have product, I'm only sorting by the name and then when it comes to fields I only want to see 88 00:05:43,150 --> 00:05:46,050 name and price. 89 00:05:46,560 --> 00:05:52,950 And by default of course we're only going to get ten because we already have that limit of ten. 90 00:05:53,220 --> 00:05:55,950 So therefore let me add here limit. 91 00:05:57,120 --> 00:06:00,590 And I'm just going to go with a limit of 30. 92 00:06:00,750 --> 00:06:04,340 Of course, that is way more than we have the product. 93 00:06:04,350 --> 00:06:06,480 So now, of course, I'll have all the products. 94 00:06:06,820 --> 00:06:07,530 Check it out here. 95 00:06:07,740 --> 00:06:09,020 I have twenty three. 96 00:06:09,570 --> 00:06:17,790 Now, if I'm going to be looking for page number two and I'll set up the limit where I want to see only 97 00:06:17,790 --> 00:06:20,400 the four items or three or two or whatever. 98 00:06:20,780 --> 00:06:28,440 Then of course you'll notice that in here effectively I'll just skip whatever items we have in limit. 99 00:06:28,830 --> 00:06:36,510 So in this case, if I go with a limit of two just to make it simpler and then if I go for page number 100 00:06:36,510 --> 00:06:44,370 two, so here I'll pass in the value of two, you'll notice how I'll skip the first two items right 101 00:06:44,370 --> 00:06:44,560 away. 102 00:06:44,610 --> 00:06:48,080 Go for this one, the Albinoni S.R.O.. 103 00:06:48,390 --> 00:06:51,080 So let me send it here and check it out. 104 00:06:51,100 --> 00:06:56,640 Now, of course, we have our money section and I purposely set them up both the same just so you can 105 00:06:56,640 --> 00:06:57,360 see how it works. 106 00:06:57,570 --> 00:07:03,600 So now, of course, we're looking at this page and as I'm changing the limit, I'll be changing how 107 00:07:03,600 --> 00:07:07,310 many items I'm getting back and how many items I'm skipping. 108 00:07:07,680 --> 00:07:14,700 And then when it comes to page, of course, it affects the amount of items we shipping as well, because 109 00:07:14,700 --> 00:07:21,000 if I go with three, then of course we will skip two times whatever is the limit. 110 00:07:21,210 --> 00:07:23,240 And those are the items were skipping. 111 00:07:23,520 --> 00:07:26,970 And of course that is going to return us of that third page.