OK, so now let's move further, so as we would have done this here is a little so we can just write
recipes for their parents or do our work like if we just write recipes here.
It will also do the same thing, but that will do it.
Only the saltwater 2.0 has no problem with that.
So now what we'll do is we'll move forward to the farm bill where everything is being done to.
So we'll wrap this all up from the hiding, whatever it is that will wrap it inside a form because whenever
we like type the key word, so then we'll press enter.
So we should get dessert, right?
So we'll wrap everything inside.
The form for that is what we are going to do.
So and I put the form tag that would be fun of last name would be.
From.
That said, we'll close this below, maybe after this move.
When is this trip going?
Search for so.
This actually, we have given a day, right, so what we can do is just change this into a form that
will be also a good like is.
This is here and.
This is a I'm sorry, but we changed into a form that would be a good choice.
I think I made a mistake like I just put baby in student form.
That's what I did.
I think that was not required at all.
But we just it was a form.
And.
This because I realize episodes from I've already created that this was the only cast which we were
given trying to give to form.
So it's already there, so there's no there's no need to like create on the form.
We're just tentative to form.
All right now, what we want to do is whenever we type on a keyboard and when we press stories on how
to enter.
So I don't want the page to reload, right?
They could react based on that only we don't want pages to reload and reload and reload.
I just want to reload down whenever I hit, and I want the data in like below without reloading the
page.
Or I create a function here below the right recipe in full through the function.
So they're going to be on some Mac.
Bonds made.
So it will take.
The second string, basically, so here it will be a function that will be making an argument that dizzy
or event, you contract the event also.
And what did I do?
So here what we'll do is we'll type e dot prevent.
Oh, my God.
Default.
This is a function for what this will do is event or prevent default.
What will do is it will prevent the side from being like reloading whenever we present or we like some
of the query, but it will prevent the app to reload.
That's it.
And also, when we submit the form I want, the data that will be gepris have been full.
So that's what we want.
And just save it.
When I go back to the U.S., so when I pressed.
OK.
OK, OK, it's it's reloading.
Something's wrong, something is wrong, but when we go back, yeah.
If what everything is, I think everything this thing looks good so far and.
But I think we have not called this function right on click on something.
We are not inside this form.
We should include this function then released to world without calling any function cannot work in this
war.
So how dumb thing was that?
All right.
So inside this weird name like that, the name of the function that is on summit again.
On Summit.
Of course not this on summit, and then we'll save it.
Now we go back here.
But as you can see, things are coming from the API, but the page is not the learning that is the best
part.
And that magic happened to you due to the event or prevent default.
So this line here is really, really important.
You can also put a comment here that this.
Will.
When Apple forbids.
From reloading.
This is a really, really important concept.
You can just learn it.
OK, so next what we'll do is now we'll go to the.
And now we want to give the customer like, you know, we want Typekit and we want the data.
So what we do is we create on the street wearable that will be storing where it is.
So it will be query and a function will be.
So gritty, I'm following that game, I'm following the camel guessing you.
So that is the first thing, things a small and then you need loot capital, so greedy and said gritty,
and it was.
State and the initial value would be empty, so now we'll save it, and now the it's showing that said,
good integrity is not used anywhere.
So what we'll do is we'll go to this form.
So inside the phone, we have the input tag.
So how do we?
We'll throw a function which is on change, so whenever any moment is going on, like whenever we are
typing something here or there should be something like one change why this is happening.
All right.
So here what we'll do is we'll write an in line function, vital function to the Zaffar title.
So here what will be the case is that we want to send the query.
Like, whenever we type something so that should be stored in equity wearable.
So an event or dot dot.
And also, we will give this input of a.
So.
That will be equal to.
Ready.
Ready for this, is it, and now we will go to our API endpoint and we will change this hardcoded chicken
into the ready, so instead of this, it can.
What I do is I'll add this.
Now, script to go ahead, it will be witty.
I hope this is good.
And you're right, yeah.
That's right, and now on clicking the button like we should gather data so wedded on something like,
oh, maybe I go back here and up or something, something, maybe I type.
Angle, some things are not changing, but when I get the recipe.
So you see something has come from the end point and let me just check if it contains something related
to mangle or not.
Yeah.
Mango, frozen yogurt, so that means our end point is working fine because when I Typekit here mango,
so the data which we are receiving back is related to mango only you can see a mango and passion fruit
eyes, mango, frozen yogurt.
And then we have the.
Which which Mango is.
OK, so now our end point is working fine, I guess.
Now we want to move further now, let's do something about this problem.
So let us just finish this.
First of all, let me just dialogue, but will style it.
Let me go back to the.
Corridor and let me go to the CSIS.
But what is the last name for that?
OK, that is a health label.
So we'll go ahead and file the App Health label now.
We keep our excuses here.
So the class name is at health labels will have.
The school and the school and.
Labels that we just checked label or labels.
Upheld labels, OK, OK, you can just copy and paste that is more productive, I think, because we
usually do spelling mistakes like we are humans, so that is the most common thing.
Compelling, I think I will give the same only maybe seven and eight.
For seven years, for top and bottom and on each pixel is for.
Left and right next will give modern left because it was.
Going a little closer, so it will be six pixels will be the margin.
Max will give the border radius.
Moderate as of four, maybe five pixels.
Let me just save it.
Let me just go back to the browser and see.
I think I need to give a little more moderate use.
But it's not over.
Maybe I can give it how much I've given her.
It's been back since.
Oh, OK.
Maybe I can just give the been in check outlooks from 15.
It doesn't look sober.
It looks quite small to me.
So what can we do about it?
Maybe I can increase its size.
ABC's.
Let me just I will make it first of all, 10 and I.
The for incitement.
It's copied this line from here yesterday.
One says maybe we can give it to the plane would be good.
I don't know.
He's just checking this looks quite.
Quite similar, actually, but not so quite some of those who like to be like Putin.
So when I go back, yeah, looks like pretty well, looks pretty seem.
OK, so now you are used basically like done all, we want to add functionality to this also.
So let's go back.
And here what we'll do is let me just close this first point, so I'll have to create another state
you state available for it.
So that will be.
And what will be its label.
So that will be health label.
And the function will be set.
Label.
All right.
And its initial value.
Would be.
Maybe we can we can just of vegetarian.
Vegetarian.
Yeah.
This will be the initial, you know, let me just jump in to the point.
And it's alcohol free right now.
So maybe we can just add alcohol free.
All vegetarian.
Saying So how do we do the same thing which we did for the Sun and this will add health labor?
Okay.
And it is so smart we can all agree to save it.
And now we want to add like different, different labels in the drop down.
Right now, there are no dropdown like voices in the dropdown so that we do in the next video.