HTML Tutorial 15 - Introduction to Forms Video Lecture | HTML Basics- Create a designed webpage from Scratch - Software Development

everybody this is Brennan if you're
following along this is video 15 in our
HTML tutorial today we'll be discussing
forms as you can see I've already got
some code written we have the start of
our form and the end of our form and in
this tutorial we're going to kind of
pick this apart and explain what exactly
this is and why you need it okay first
off a form is an area of the page that
allows you to get user input you've seen
it a million times for example when you
go to Google and you do a search you're
using a form let's go ahead and make
like a very simple search feature you
notice I'm starting with input and then
I'm adding attributes to this this type
is text which means it'll be a text box
the name you can give it any name but
we're just going to call it search the
size is how large it will display in
this case it'll be 30 characters and the
value is the initial value that it will
have save our work
hey let's flip over to our web page and
you see there's a text box and the user
contact sorry not text was thinking
about my phone the user can search in
this text box now it's not very
functional it's just a text box so what
we need to do is add other inputs
now if you're wondering what type
submit' equals um think of how you would
get this information from point A to
point B you have to submit the
information or as I'll explain in a
minute you have to post it save artwork
whoops
appears I've made a boo-boo as you can
see I forgot the double quotes let's go
back and fix that real quick all right
there you go now here is our text let's
say we want to search for dinner because
I'm hungry and we have a search button
now when you click this what do you
think is going to happen well not much
really you click it and it will say this
form is being submitted by email well
that's not really the results we wanted
so let me go through and explain what's
going on here here's our form inside of
our form we have inputs inputs allow the
user to enter data or input data we have
to send the data the input somewhere
using a method in this case we're
posting the data you don't really need
to understand what a post is at this
point just understand that you're moving
the data from point A to point B post is
simply the underlying HTTP protocol
action this is how you're going to get
the data from point A to point B in this
case we're going to mail to and then
just an email address me at home calm
now typically you would either mail the
form in this case it would you know go
to an email address or you would send it
to another page and in the other page
you would have code not HTML
unfortunately you would be using a
server-side code typically to pull the
information off and put it into a
database we're not quite there in our
tutorials yet so just follow along on
the forms
inside the form we have inputs here you
see we have the start of an input the
attribute type its text the name is
search the size of 30 characters the
value is search here you can put
whatever you want in there you can even
omit the value but you know it's good
form to just blank it out if you want
just a blank area see now in this point
if you were to hit the search button
flip back to your code what do you think
is going to happen
take a second okay if you guess that
we're going to post this data to page
two you're correct let's go ahead and
try that and see what happens
well absolutely nothing if you remember
page two is from our previous tutorials
the data did get posted but we don't
have any code in page two to process
that I know this was pretty confusing
and we're going to visit on some key
parts of forms here in the next couple
tutorials I want to really spread this
out explain this in depth because it's a
very big part of what web designers do
nowadays I thank you for watching and I
hope you found this video we'll and
entertaining