1
00:00:02,300 --> 00:00:06,640
Now, I did mention that there are special HTML elements,

2
00:00:06,640 --> 00:00:09,730
which you can use for building such a form and for fetching

3
00:00:09,730 --> 00:00:11,290
that user input.

4
00:00:11,290 --> 00:00:13,960
And of course, we're going to write code

5
00:00:13,960 --> 00:00:16,250
in a couple of seconds and we're going to

6
00:00:16,250 --> 00:00:19,384
explore those elements in code.

7
00:00:19,384 --> 00:00:22,760
But I want to give you an overview of the

8
00:00:22,760 --> 00:00:26,400
most important elements there right away.

9
00:00:26,400 --> 00:00:30,350
And the most important HTML element

10
00:00:30,350 --> 00:00:33,980
you will use all the time when fetching user input

11
00:00:33,980 --> 00:00:37,260
will be the 'input' element.

12
00:00:37,260 --> 00:00:39,310
And I guess the name makes a lot of sense,

13
00:00:39,310 --> 00:00:41,670
because this element is all about

14
00:00:41,670 --> 00:00:46,000
fetching user input, hence the name.

15
00:00:46,000 --> 00:00:48,800
And here, I also already added

16
00:00:48,800 --> 00:00:51,870
this 'type' attribute, because that will be

17
00:00:51,870 --> 00:00:54,320
extremely important to configure

18
00:00:54,320 --> 00:00:57,250
which kind of input we want to fetch.

19
00:00:57,250 --> 00:00:59,710
Do we want to fetch plain text?

20
00:00:59,710 --> 00:01:02,020
Do we want to fetch an email address?

21
00:01:02,020 --> 00:01:04,349
Do we want to fetch a phone number?

22
00:01:04,349 --> 00:01:06,970
You can configure different types of inputs

23
00:01:06,970 --> 00:01:09,463
with that 'type' attribute.

24
00:01:10,420 --> 00:01:13,860
Now, another very important form element

25
00:01:13,860 --> 00:01:17,310
is the 'text area' HTML element.

26
00:01:17,310 --> 00:01:21,150
That will be an element that allows us to fetch

27
00:01:21,150 --> 00:01:23,840
multiline text input.

28
00:01:23,840 --> 00:01:27,030
So where the 'input' element typically focuses on

29
00:01:27,030 --> 00:01:29,763
short input, single line input,

30
00:01:29,763 --> 00:01:34,310
the 'text area' field would be used if we, for example,

31
00:01:34,310 --> 00:01:36,350
want to fetch the comment text,

32
00:01:36,350 --> 00:01:40,690
or the feedback text a user provides to us.

33
00:01:40,690 --> 00:01:43,200
Another important HTML element,

34
00:01:43,200 --> 00:01:45,410
which we'll see in this course section,

35
00:01:45,410 --> 00:01:48,530
will be the 'select' HTML element,

36
00:01:48,530 --> 00:01:52,570
which we can use to build drop-downs to allow the user

37
00:01:52,570 --> 00:01:57,070
to choose a value from multiple available values.

38
00:01:57,070 --> 00:02:00,200
And then the last very important element

39
00:02:00,200 --> 00:02:02,930
will be the 'button' element.

40
00:02:02,930 --> 00:02:06,623
Where the first three elements are about the user

41
00:02:06,623 --> 00:02:10,056
entering or selecting some values,

42
00:02:10,056 --> 00:02:12,900
this button element is not about that,

43
00:02:12,900 --> 00:02:15,980
but about confirming those values.

44
00:02:15,980 --> 00:02:20,820
We need a button in basically any form so that the user is

45
00:02:20,820 --> 00:02:25,110
able to confirm that input and submit that form.

46
00:02:25,110 --> 00:02:27,760
Alternatively, what you will also see

47
00:02:27,760 --> 00:02:30,220
in this course section, we can also add

48
00:02:30,220 --> 00:02:33,160
reset buttons that will reset a form,

49
00:02:33,160 --> 00:02:36,520
maybe in addition to the submit buttons.

50
00:02:36,520 --> 00:02:39,383
But we are going to see all of that throughout

51
00:02:39,383 --> 00:02:42,450
this course section, and therefore let's now

52
00:02:42,450 --> 00:02:45,234
leave the theory and let's get our hands dirty,

53
00:02:45,234 --> 00:02:48,303
and let's start creating some forms.

