1 00:00:02,050 --> 00:00:05,260 OK, guys, let's go and see how we can add. 2 00:00:07,870 --> 00:00:13,200 OK, guys, let's go and see how we can enforce inside our website. 3 00:00:13,570 --> 00:00:14,700 Here we have this page. 4 00:00:15,430 --> 00:00:16,840 We got no wrong with that. 5 00:00:17,530 --> 00:00:20,380 Let's go back to our current here. 6 00:00:21,050 --> 00:00:26,200 The first thing we need to add is an input for the name here. 7 00:00:26,770 --> 00:00:33,190 We need to give a tag for the form in order to separate between the form and the content. 8 00:00:33,850 --> 00:00:41,440 Here, we can add our asterisk to and a horizontal line and actually spark within a tank, which is 9 00:00:41,440 --> 00:00:45,060 called form form. 10 00:00:47,590 --> 00:00:55,390 When you send the search web developer, the back end developer, you will be needed to give here action 11 00:00:58,990 --> 00:01:01,200 and also method. 12 00:01:01,740 --> 00:01:04,500 This is for the PSP web developer. 13 00:01:04,840 --> 00:01:07,050 You don't need to type anything inside. 14 00:01:07,270 --> 00:01:10,900 The HP web developer will do this part. 15 00:01:11,770 --> 00:01:13,330 What what's inside? 16 00:01:13,460 --> 00:01:14,920 We can add a label. 17 00:01:16,150 --> 00:01:22,150 We there's a tag which is called L'Etoile and I'm going to show you the difference between the label 18 00:01:22,150 --> 00:01:24,460 and the input so we can separate between them. 19 00:01:24,460 --> 00:01:36,420 When you are quitting a website yourself and we can add a label for let's give it for the name and think 20 00:01:36,430 --> 00:01:40,810 here we can type your name. 21 00:01:42,710 --> 00:01:49,540 And then after this part we can add an input input with type. 22 00:01:49,960 --> 00:01:54,790 And you can see here we have type of button checkbook's color date. 23 00:01:54,850 --> 00:02:03,430 The timing of that, we we're going to use the date time, the put in and attached. 24 00:02:03,610 --> 00:02:07,190 We can also use the password here. 25 00:02:07,210 --> 00:02:14,920 We can use Chapstick because in effect and then we can close this one. 26 00:02:15,070 --> 00:02:25,480 But we typed before we can give an idea of the main and very soon in the please ask you what the object 27 00:02:25,480 --> 00:02:25,870 is. 28 00:02:26,620 --> 00:02:33,430 And then when we go back to our page, you scroll down here. 29 00:02:33,430 --> 00:02:34,390 We have this input. 30 00:02:35,290 --> 00:02:40,860 So now we know what is the label and the input we put a label to be for this input. 31 00:02:40,870 --> 00:02:49,320 So when the HP web developer funds, it could have will know that this label is for the name. 32 00:02:49,930 --> 00:02:58,480 And when we when we apply the patch, we will be applied for this label and this input because of their 33 00:02:58,900 --> 00:03:11,740 name, that when we go after this part, let's try to add something for the unmap label, the label 34 00:03:12,100 --> 00:03:14,950 sorry we got something wrong label. 35 00:03:15,400 --> 00:03:20,590 And here we can make for e-mail closet. 36 00:03:21,550 --> 00:03:28,270 And inside here we can just type your e mail e-mail address. 37 00:03:28,430 --> 00:03:28,990 It's OK. 38 00:03:31,510 --> 00:03:34,180 Let's see what we have if we need to a line. 39 00:03:36,730 --> 00:03:38,350 Yes, we need to pick a line. 40 00:03:38,620 --> 00:03:42,910 We can go back to our source code and just add the R. 41 00:03:46,090 --> 00:04:02,350 The R and after this label, we can act in good with for the idea of e-mail and type of email. 42 00:04:04,830 --> 00:04:08,830 Then after the start, we can close our tank. 43 00:04:09,400 --> 00:04:13,300 Let's go back and see what we have inside our Web page. 44 00:04:16,900 --> 00:04:21,010 Now we have an email address we can try to act now for. 45 00:04:21,700 --> 00:04:23,020 Let's see what we can do. 46 00:04:23,270 --> 00:04:29,020 We can easily label for passwords. 47 00:04:32,290 --> 00:04:38,360 And then inside the label, we can just type your password. 48 00:04:41,350 --> 00:04:46,030 I think we need to create a line so we can just type P r right here. 49 00:04:47,170 --> 00:05:00,520 And after the password, we can make input input with a type of password and then we can give it an 50 00:05:00,520 --> 00:05:02,250 idea of password. 51 00:05:04,080 --> 00:05:08,020 Let's see that we have inside our Web page. 52 00:05:08,680 --> 00:05:14,950 And I'm going to show you the difference between the email address and the name and the password. 53 00:05:15,370 --> 00:05:16,390 This is the password. 54 00:05:16,780 --> 00:05:18,070 This is the email address. 55 00:05:19,390 --> 00:05:20,380 Let's go back. 56 00:05:23,110 --> 00:05:34,060 We can go after this part and try to get something for the date we can make here, label for a date. 57 00:05:35,410 --> 00:05:39,910 And inside here, we can just type your first 58 00:05:43,000 --> 00:05:43,390 date. 59 00:05:44,890 --> 00:05:50,660 And here we can edit input with that type. 60 00:05:50,980 --> 00:05:52,500 Here we got all of the types. 61 00:05:52,510 --> 00:05:54,050 You can try anything you want. 62 00:05:54,070 --> 00:05:57,590 We got range number one image and all of that. 63 00:05:58,240 --> 00:06:07,600 Let's try for the date time local and for the idea we can just type date that we have right here. 64 00:06:10,790 --> 00:06:17,690 Now we've got this date we can choose any date we want from here, as you can see from here, we've 65 00:06:17,690 --> 00:06:20,180 got all of the months and years. 66 00:06:21,980 --> 00:06:29,590 OK, we can go back to our could, let's think about it, we want to add a put in for the submission. 67 00:06:30,410 --> 00:06:31,640 We can go here. 68 00:06:31,980 --> 00:06:34,190 Let's bring the line here first. 69 00:06:37,010 --> 00:06:49,070 And here we can begin with that type, or we can just input input with type of the supplement button. 70 00:06:49,220 --> 00:06:52,340 So this will be used for the subcommission. 71 00:06:53,960 --> 00:06:57,500 We don't need to add for an idea for this one here. 72 00:06:59,240 --> 00:07:05,720 We can go back to our source code, reload, and now we got the submit put in. 73 00:07:05,930 --> 00:07:13,040 What if what if we want to change the content inside this button, we can just go back to our source 74 00:07:13,040 --> 00:07:15,260 code and the value 75 00:07:17,870 --> 00:07:23,800 of click here to supplement that. 76 00:07:26,000 --> 00:07:28,340 Now we got click here to supplement. 77 00:07:29,000 --> 00:07:29,870 That's perfect. 78 00:07:30,620 --> 00:07:38,480 And add to this part we can submit from here, but we get something here I don't like. 79 00:07:38,750 --> 00:07:41,000 We want to make this filled required. 80 00:07:41,000 --> 00:07:45,020 So I cannot I cannot submit the form without filling it. 81 00:07:45,530 --> 00:07:52,100 We can go back to our source code from here and just add here required. 82 00:07:52,760 --> 00:07:55,970 We can cover this bar and put sit here. 83 00:07:56,300 --> 00:07:58,100 Let's do what we have when we do this. 84 00:07:58,100 --> 00:07:58,460 But 85 00:08:02,900 --> 00:08:08,030 now when we click on click here to submit, we got please fill this film. 86 00:08:08,330 --> 00:08:10,130 We can just type by Assad. 87 00:08:10,850 --> 00:08:18,620 And when we go to the place filled with type again one that and your password, you can just type anything 88 00:08:18,660 --> 00:08:18,900 here. 89 00:08:19,010 --> 00:08:21,500 Doesn't matter when I go here. 90 00:08:22,580 --> 00:08:32,360 Please include an at in the email address because it's not an email address like your here at example 91 00:08:33,530 --> 00:08:34,160 dot com. 92 00:08:36,560 --> 00:08:38,480 Please fill out this filled. 93 00:08:38,840 --> 00:08:40,820 We can try something for this. 94 00:08:43,910 --> 00:08:45,170 Click here to submit. 95 00:08:45,350 --> 00:08:52,970 Now we can submit the form that's perfect and now we know how to add a form inside our website. 96 00:08:53,240 --> 00:08:57,500 In the next section we will move to the S3. 97 00:08:57,860 --> 00:08:59,560 Good luck and have fun.