Let's start with the form submission
and validation before we then thereafter
conclude this challenge by adding styling.
Now for this, you'll learn that to configure
how the form is submitted,
you go to this form element and there you got the action
and the method attribute which you can set.
Now, the action attribute is set
to the URL to which the form should be submitted
or to the path after the URL by which that form
is being served to which the form should be submitted.
And the methods then is set to GET or POST.
Now you did learn that POST is actually the value you want,
but it doesn't work without a server site
that is prepared to handle POST requests.
And since we don't have such a server side yet
since we have no code on the server side
that would handle POST requests,
we don't stick to GET for now.
And for the action,
I'll just enter slash challenge here so that the form
is submitted to this current sub folder.
So to that path which is responsible
for serving this HTML file.
If you did use other values here,
that doesn't matter too much, since form submission
isn't really the focus of this task
anyways since that service side part is missing.
Now regarding the validation, it's up to you
which kind of rules you wanna add
but I think it's fair to say that we definitely
wanna require all those fields.
None of those fields should be empty and therefore we need
to add the required attribute to all those inputs.
This is a Boolean attribute as you learned.
So the existence of it alone is enough.
And if it does exist on an element,
this element is required.
So a user needs to enter a value here.
Submitting this input in an empty state is not allowed.
And therefore "required" is definitely an attribute
I'll add to all those inputs and also
to the text area also to the drop down.
Though there one value is selected out
of the box from the start automatically.
Nonetheless, we can still add it to the select element
as well and also add it to all those radio buttons here.
And then you'll learn that only one of them has
to be selected to fulfill this criteria.
And I'll also add it to this checkbox field.
We can only submit this form if the user
did accept the terms but you can of course add more rules.
You can, for example,
require a min length on the phone number field.
So not a min value, not a min number,
but a min length of five because you are convinced
that there are no phone numbers shorter than five,
and hence any value shorter
than five characters long would be invalid.
The message may be also should have a min length of 10
but then also especially a max length of 200.
So that users can't enter super long messages.
And that's it for me but you can of course,
add more rules if you want to.
Now I'll auto format that code to make
it a bit more readable and then I'll move on to the styling.