1
00:00:00,080 --> 00:00:00,500
All right.

2
00:00:00,500 --> 00:00:03,860
And up next, let's complete Get All Jobs page.

3
00:00:03,890 --> 00:00:08,870
More specifically, we're going to work on the search functionality as well as the pagination.

4
00:00:08,900 --> 00:00:16,580
Now, when it comes to search functionality, we're going to use query params, also known as URL parameters,

5
00:00:16,580 --> 00:00:19,400
or they're also called query strings.

6
00:00:19,400 --> 00:00:26,150
So lots of names, but essentially they're used to pass information to a web server through the URL

7
00:00:26,180 --> 00:00:27,550
of the web page.

8
00:00:27,560 --> 00:00:35,060
Now they're typically appended to the end of the URL after the question mark and separated by ampersands.

9
00:00:35,150 --> 00:00:38,150
Query parameters consist of key value pairs.

10
00:00:38,670 --> 00:00:44,310
Where the key represents the parameter name, and then the value represents the corresponding data being

11
00:00:44,310 --> 00:00:51,210
passed, and they're commonly used in the web applications to provide additional context or parameters

12
00:00:51,210 --> 00:00:52,930
to a server.

13
00:00:52,950 --> 00:01:01,170
So if we navigate to a complete project, look for get all jobs, look for search form and just change

14
00:01:01,170 --> 00:01:02,860
any of these values over here.

15
00:01:02,880 --> 00:01:04,769
So this is totally up to you.

16
00:01:04,800 --> 00:01:10,050
You can provide your search term or you can just go with different status.

17
00:01:10,620 --> 00:01:12,030
Notice once we do that.

18
00:01:12,770 --> 00:01:14,420
We refresh the page.

19
00:01:14,420 --> 00:01:23,060
And what's more interesting now in the URL, we have this question mark and we have a long list of query

20
00:01:23,060 --> 00:01:23,780
strings.

21
00:01:23,990 --> 00:01:27,040
And essentially they are separated by key value pairs.

22
00:01:27,050 --> 00:01:35,030
And now on a server we process them and based on this value we actually return jobs.

23
00:01:35,030 --> 00:01:36,140
So now check it out.

24
00:01:36,140 --> 00:01:44,030
Since I looked for pending, now I'm only getting the jobs where the status is pending.

25
00:01:44,030 --> 00:01:46,100
So this is what we're going to set up.

26
00:01:46,160 --> 00:01:51,170
As you can see, we have one, two, three, four values that we want to use.

27
00:01:51,170 --> 00:01:55,680
So one is going to be for search then the job status and job type.

28
00:01:55,700 --> 00:01:56,930
Pretty straightforward.

29
00:01:56,930 --> 00:02:04,490
Basically, I'll search based on the job status and job type and also we'll add the sort option where

30
00:02:04,490 --> 00:02:11,240
I can go, for example, with A to Z and Z to A and newest and oldest like always, we're going to start

31
00:02:11,240 --> 00:02:12,060
on a server.

32
00:02:12,060 --> 00:02:15,150
And first, I guess let's understand two important things.

33
00:02:15,150 --> 00:02:21,990
First, how we can pass them in the Thunder client, the query parameter, and second, how we can access

34
00:02:21,990 --> 00:02:22,860
on the server.

35
00:02:22,860 --> 00:02:28,320
Now of course, eventually we'll work on the front end and then I'll show you how we can pass it in

36
00:02:28,320 --> 00:02:29,160
the front end.

37
00:02:29,160 --> 00:02:31,500
But the server side is not going to change.

38
00:02:31,500 --> 00:02:35,040
Once we understand how we can access them, we're going to be good to go.

39
00:02:35,040 --> 00:02:38,880
So for starters, let's go to get all jobs request.

40
00:02:38,880 --> 00:02:43,170
So once we make the request, we should get some jobs back.

41
00:02:43,170 --> 00:02:51,690
And in my case, since I populated the database for John, I have tons of jobs back and check it out.

42
00:02:51,720 --> 00:02:55,980
We can either type the query string over here manually.

43
00:02:55,980 --> 00:03:00,090
Basically I can type question mark and then provide the key value pair.

44
00:03:00,090 --> 00:03:07,110
And then of course, if I have multiple the ampersand or we can use nicely here this query tab and then

45
00:03:07,110 --> 00:03:07,590
check it out.

46
00:03:07,590 --> 00:03:09,510
Basically we're right away.

47
00:03:10,020 --> 00:03:13,770
Get the name for the parameter and also we can set up the value.

48
00:03:13,860 --> 00:03:16,300
So let's try over here.

49
00:03:16,320 --> 00:03:22,320
I'm going to type search since that's the value we're going to use and I'm going to stick with that.

50
00:03:22,320 --> 00:03:24,120
And then as far as the value.

51
00:03:24,150 --> 00:03:27,450
Well, for starters, we're not going to have any regex functionality.

52
00:03:27,450 --> 00:03:30,390
Basically, we're only going to get jobs that match.

53
00:03:30,420 --> 00:03:31,350
Exactly.

54
00:03:31,350 --> 00:03:37,740
And therefore, in my case, I'm going to look for position and I'm going to pick one of the jobs.

55
00:03:37,740 --> 00:03:40,350
So I want to make sure that it matches.

56
00:03:40,440 --> 00:03:41,400
Exactly.

57
00:03:41,400 --> 00:03:46,350
So let me go, I guess, with this one, since the name is somewhat short.

58
00:03:46,350 --> 00:03:49,320
So let me copy this over here.

59
00:03:49,320 --> 00:03:51,990
So now let me open up the integrated terminal.

60
00:03:51,990 --> 00:03:55,770
Then let's hop over to job controller.

61
00:03:55,770 --> 00:04:04,500
And in order to access those query params, we want to go here with log and then req and query so it's

62
00:04:04,500 --> 00:04:05,940
not params.

63
00:04:05,940 --> 00:04:08,010
So those were the URL parameters.

64
00:04:08,010 --> 00:04:13,470
When we're looking for query parameters, we go with req dot query and now check it out.

65
00:04:13,470 --> 00:04:14,580
I'll save it.

66
00:04:14,820 --> 00:04:19,589
Now let's navigate back, make the request and notice something interesting.

67
00:04:19,589 --> 00:04:21,899
So I have here this search.

68
00:04:21,899 --> 00:04:23,460
So I'm getting the object.

69
00:04:23,460 --> 00:04:26,580
And of course in here I have the value.

70
00:04:27,400 --> 00:04:31,750
And you can probably already imagine that the more parameters we're going to add.

71
00:04:31,780 --> 00:04:35,500
Yes, all of them are going to be over here as properties.

72
00:04:35,530 --> 00:04:38,330
So now let's put two and two together.

73
00:04:38,350 --> 00:04:45,150
We have a search, some kind of value that we're getting eventually from the front end.

74
00:04:45,160 --> 00:04:51,040
And now on the server, we have this find and in here we have the filter object.

75
00:04:51,640 --> 00:04:58,500
We could use that search value in order to search for specific jobs.

76
00:04:58,510 --> 00:05:01,930
For example, since I'm using position, I could say, you know what?

77
00:05:01,960 --> 00:05:03,400
Not only get.

78
00:05:04,070 --> 00:05:12,260
The jobs where the user ID matches whatever I have coming in, but also look for position and let's

79
00:05:12,260 --> 00:05:16,420
set it equal to rec dot query and search.

80
00:05:16,430 --> 00:05:19,280
Yes, of course, eventually we'll use regex and all that.

81
00:05:19,280 --> 00:05:27,880
But if everything is correct, I should get at least this one job where position is equal to this value.

82
00:05:27,890 --> 00:05:28,940
So let's try it out.

83
00:05:28,940 --> 00:05:30,860
I'm going to go back to get all jobs.

84
00:05:30,860 --> 00:05:33,620
Let's make the request and now check it out.

85
00:05:34,220 --> 00:05:40,010
I get back this one job because of course, now I was searching for a specific position.

86
00:05:40,010 --> 00:05:44,690
And with this in place now we can work on the more complex setup.