How are you all, I hope everyone is good. Are there. And with EduTecBD So let's start today's episode. In the last episode, I showed how to create a table. Hopefully, you have done it very well. One thing to remind us that just reading the tune or never seeing the code will not be able to learn anything better. You must practice everything, otherwise, you will not learn anything.

Now let's start discussing today's topic. If you open an account on different sites in the net, you must fill out various forms. For example, Facebook, Gmail Today we will learn how to create different sections of this form.

Normally the things that are in the form are:

  • Text field
  • button
  • Password field
  • checkbox
  • Drop-down box is

a good thing to say, that is, if I want, you can show all the parts at once, but I will not do it here. I will show each part separately before each and then at the end of the last one will show the code of a complete form. Let's learn it better.

The first thing I will look at is how to create a text field. Type a code below with a notepad.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
</pre>
<html>
<head>
<title>Text Field</title>
</head>
<body>
<form>
Your Name:
<input type="text" name="yourname"/>
</br>
Father Name:
<input type="text" name="fathername"/>
</form>
</body>
</html>
<pre>

 

Save the code with a .html extension and see the result. Here the code is used in the <form> tag, which defines the form. And the input tag used for the input field. Also, the type of input type in the input tag is also given. I hope there is no problem in understanding this. Now let's learn a lesson using a little change in the code. In the previous code, we took input in two text fields, but we have to do something about it. At least with the input, you have to send it somewhere? And for that, we must have a submissions button. Now we will see how to add the submit button. It does not need to do too much to do this. This line will be added to your previous code only - <input type = "submit" value = "submit" />. The whole code below is given below.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
</pre>
<html>
<head>
<title>Submit</title>
</head>
<body>
<form>
Your Name:
<input type="text" name="yourname"/>
</br>
Father Name:
<input type="text" name="fathername"/>
</br>
<input type="submit" value="Submit"/>
</form>
</body>
</html>
<pre>

 

create a radio button With Html

The thing that will be learned here is how to create a radio button. Radio buttons are usually used when the user selects one of several options. Now type a code below with a notepad, type it below.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
</pre>
<html>
<head>
<title>Radio</title>
</head>
<body>
<form action="">
Male
<input type="radio" name="Sex" value="male">
<br/>
Female
<input type="radio" name="Sex" value="female">
</form>
</body>
</html>
<pre>

 

Now save it with a .html extension and see that the radio button has been created. I do not think there is much to say about the code because I'm assuming that you can understand why and how it is used. To say something new, it is necessary to talk about it the same way.

Now let's see how to create a checkbox. The checkbox is usually used when the user chooses one or more options from multiple options. Now type a code below with a notepad, type it below.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
</pre>
<html>
<head>
<title>Text  Box</title>
</head>
<body>
<p> Game you like to play </p>
<form action="">
Football:
<input type="checkbox" name="game" value="football">
<br/>
Cricket:
<input type="checkbox" name="game" value="cricket">
<br/>
Baseball:
<input type="checkbox" name="game" value="baseball">
<br/>
Volleyball
<input type="checkbox" name="game" value="volleyball">
<br/>
</body>
</html>
<pre>

 

I think you have no problem. You face any problem or not understand anything you please comment here and contact with facebook.

Thanks for reading this whole article. We hope your result will be outstanding So that your family will be delighted. Keep in touch with EduTec BD and we will give you the right information.

For any information, you want to know comment below we will provide you as soon as possible.

Join us on our Facebook Page: EduTec BD

Join us on our Facebook Group:  EduTec BD

LEAVE A REPLY

Please enter your comment!
Please enter your name here