1
00:00:00,000 --> 00:00:04,396
[संगीत ]

2
00:00:04,396 --> 00:00:09,510
We have reached the end of
the third module of this course.

3
00:00:09,510 --> 00:00:13,070
This is the time for
your third assignment.

4
00:00:13,070 --> 00:00:18,132
In this assignment, we're going to
look at the Bootstrap components

5
00:00:18,132 --> 00:00:23,121
that we examined in this module and
add a few to our index.html page.

6
00:00:25,036 --> 00:00:30,190
Your third assignment
involves three tasks.

7
00:00:30,190 --> 00:00:36,930
The first task is to take the reservation
form that you created earlier

8
00:00:36,930 --> 00:00:42,470
in one of the content rows below, and then
cut that form out from the content row.

9
00:00:42,470 --> 00:00:49,140
And then create a model that contains
the same reservation form for your table.

10
00:00:49,140 --> 00:00:52,620
So you can see that we have the number
of guests here, and the date and

11
00:00:52,620 --> 00:00:56,600
time here, and then two buttons,
the Reserve and Cancel button.

12
00:00:56,600 --> 00:00:59,340
Just like you had for
the reservation form.

13
00:01:00,950 --> 00:01:06,390
In addition, the second task
in this assignment is to add

14
00:01:06,390 --> 00:01:12,970
one more row here with
a radio button here.

15
00:01:12,970 --> 00:01:17,980
So here you will allow the user to specify

16
00:01:17,980 --> 00:01:21,690
which section of the restaurant
they want the table in.

17
00:01:21,690 --> 00:01:24,800
Whether it is non-smoking or
the smoking section.

18
00:01:24,800 --> 00:01:28,820
By default,
the non-smoking section will be selected.

19
00:01:28,820 --> 00:01:31,690
If the user wants the smoking section,

20
00:01:31,690 --> 00:01:36,690
then the user will click the button
to select the smoking section.

21
00:01:36,690 --> 00:01:38,870
If the user wants the non-smoking section,

22
00:01:38,870 --> 00:01:43,860
then obviously the user will click on the
non-smoking section to select the button.

23
00:01:43,860 --> 00:01:50,910
So this is a radio button group here with
two buttons here, Smoking and Non-Smoking.

24
00:01:50,910 --> 00:01:57,840
So that is your second task in this
assignment, to add the button here.

25
00:01:59,510 --> 00:02:04,310
The third task is to
turn this button here,

26
00:02:04,310 --> 00:02:08,030
the Reserve Table button here,
to invoke the model.

27
00:02:08,030 --> 00:02:11,520
So when you click on the button
it shows and hides the model.

28
00:02:12,720 --> 00:02:18,735
To do this, you first need to remove
the tool tip from the reserve table,

29
00:02:18,735 --> 00:02:22,965
otherwise that functionality won't work.

30
00:02:22,965 --> 00:02:28,725
And also remove the script,
the JavaScript code that you added

31
00:02:28,725 --> 00:02:35,445
to the end of the index.html
page to trigger the tool tip.

32
00:02:35,445 --> 00:02:40,178
So doing that, and
then make this Reserve Table button

33
00:02:40,178 --> 00:02:45,040
act as the toggle for your model.

34
00:02:45,040 --> 00:02:48,500
So that is your third
task in this assignment.

35
00:02:49,650 --> 00:02:55,876
Hope you enjoyed creating this new
variation of the index.html page.

36
00:02:55,876 --> 00:03:01,788
[संगीत ]