uh to grab the value inside of the text
field so inside here this would be Alex
and this would be Garrett so what we can
go ahead and do then is actually combine
it so what I want to do is I want to say
combined uncore text remember this is
the variable that we initiated up here
and then I want to say plus equals so
this will just add this value on every
single time uh we then want to go ahead
and append a space on on just on the end
of here so uh what we can do now is we
can go ahead and alert
sayc combined undor text so We're
looping through each uh input field with
a type text so using each we're then uh
adding the value with a space on the end
onto combined text and then we're just
alerting out so we can see what result
we've got already if I was to type Alex
Garrett and click combine you see the
result is Alex Garrett so uh now what we
want to go ahead and do is actually
place this inside of the combined div uh
remember we created this div down here
where we can display our result and in
here I use a selector combined because
we're selecting by ID and then I just
simply say text combined text uh and now
when I refresh and enter some more
data and click combine you see this text
appears down here now like I said with
the each we actually are looping through
each uh element that has uh or that
exists within this range of this range
of selectors so for for example if I was
to go ahead and just literally create
another uh input
field of the type text remember that's
important uh I now have three so I can
go ahead and type Alex James Garrett and
because we've used each to Loop through
uh to Loop through every input field
with the type text uh because this
selector still matches we're going to
loop three times this time first of all
with the index zero then the index one
then the index two and when we click
comb fine uh we get all the results here
so there's not really any uh need for
you you know using these this selection
method uh but for example if you wanted
to go ahead and loop through all input
fields to check if they were all uh
empty for example uh you could do this
for things like form validation uh so
for example if you wanted to check all
uh input Fields had actually had a value
um you can go ahead and do this so let's
just uh give an example here uh let's
get rid of this uh combined text and
let's also get rid of this combined div
and we're just going to be displaying a
message out so let's just say we want to
validate each box so all three of these
uh we want to go ahead and and check
that they have a value uh within them so
if someone has typed something so what
I'm going to do is I'm just going to get
rid of this and I'm going to say if uh
and this do Val is equal to
nothing then I want to say um let's just
say failed equals true uh and let's just
go ahead and get rid of this
here far failed equals false so
essentially what we're doing is we're
setting a failed variable up here uh
equal to false now that will remain
false uh until here unless one of these
input field uh is empty so if this Val
for each field equals nothing then fail
is equal to true or failed is assigned
the value true so now what we can do
down here uh is we can say um if failed
equals equals
true
alert uh fill out all Fields
else if failed is equal to
false
alert thanks for filling out all
field just as an example um hopefully
you understand what we're doing again
I'll just run through it for those who
don't we've got VAR failed equal to
false so you know we this comes into
this check down here now for each input
field we're checking the value uh
against nothing and if the value I.E if
the first value the second value or the
third value is equal to nothing this
variable is changed to true and
therefore we have this part of the if
statement executed if it stayed at false
I.E if all the values were full uh then
we uh execute this part of the uh if
statement so for example if I click
combine now thanks oh no okay yeah so
we've got something going on wrong here
uh let's just double
check oh yeah sorry I've included a
dollar sign there uh that's just
probably because of my PHP background uh
so let's go ahead and click combine uh
it says fill out all Fields if I go out
and fill the first one and click combine
it still says fill out all Fields
because the two are empty therefore the
failed variable has been set to True uh
let's go back and just set the third one
or the second one sorry fill out all
fields and finally the last one and now
failed will continue to equal false
because it wouldn't have uh this line
here wouldn't have run uh when we click
combine thanks for filling out all field
so that's just another example of how it
can be useful for say validation
purposes uh you might have a lot of text
fields that you want to check uh and if
you are doing front end validation as
opposed to backend server side
validation then uh this is a great way
to do it because you are saving yourself
a lot of duplicate code a lot of nested
if statements or a lot of uh if else if
statements so this is a really good way
to do that obviously the first example
was less uh more more pointless than
this one but this one is relevant and
using each uh is a great way to Loop
through uh different elements and
remember this doesn't just apply to text
Fields it applies to anything check
boxes text areas you know you name it
any field even divs for example or spans
or you know paragraphs anything
absolutely anything so as long as you're
using a selector here it will pick up on
uh each element that um you know is
returned by this particular selector so
that's the each uh function if you like
in jQuery and a bit about how useful it
can be