DEV Community

Codewithrandom Blogs
Codewithrandom Blogs

Posted on

Create Feedback Form In HTML Code

Hey Guys, Welcome To Our Blog, In Today's Blog We Are Going To See How To Create An Simple Feedback Form Using HTML Code Only.

A Feedback form is a form where user can enter their personal details and write about their point as feedback and submit it. The feedback may be in any form like events, trail classes, products, etc. So Likewise we are going to create this project using HTML Only.

So,  Let's Begin Our Feedback Form Project By Adding The Source Codes. For That, First, We Are Using The Html Code.

Html Code For Feedback Form:-

<HTML>
  <HEAD>
    <TITLE>Feedback Form</TITLE>
  </HEAD>
  <BODY>
    <H1>Feedback Form</H1>
    <FORM action="mailto:simon.long@cit.ie" method="post" enctype="text/plain">
      First Name : <INPUT type="text" name="firstname" placeholder="Enter name here">
      Second Name : <INPUT type="text" name="secondname"  placeholder="Enter surname here">
      <BR>
      <BR>
      <!--It's important that both of these radio button have the same name so they behave as one component (i.e. Only one can be selected at a time)-->  
      <INPUT type="radio" name="gender" value="male">Male<BR>
      <INPUT type="radio" name="gender" value="female">Female  
      <BR>
      <BR>
      <!--This uses the new HTML "email" INPUT type which will automatically validates the email address when the SUBMIT button is clicked-->
      email: <INPUT type="email" name="mail" placeholder="e-mail address">
      <BR>
      <BR>
        Comment :<BR>        
        <TEXTAREA rows="6" cols="50" name="commentfield"></TEXTAREA>
        <BR>
        <SELECT name="countychooser">
          <OPTION value="cork">Cork</OPTION>
          <OPTION value="dublin">Dublin</OPTION>
          <OPTION value="galway">Galway</OPTION>
          <OPTION value="kerry">Kerry</OPTION>
        </SELECT>
        <BR>
        <BR>
        <INPUT TYPE="submit" value="Send Feedback">
        <INPUT TYPE="reset" value="Reset">
    </FORM>

  </BODY>  
</HTML>
Enter fullscreen mode Exit fullscreen mode

Here We have successfully added out HTML code. In this code first we create an title with h1 tag and creating an form class with method.

Now Inside Form class we started adding every contents. Like First name , Second name , Gender , Email , Comment(Feedback) and lastly Submit Button.

Each One is added with the Input tags with separate names and placeholders and the comment box which is feedback area is done with text area tag with name and cols.

Additionally , We have created a section for choosing country by drop down list and that is done with option tag with specify country name for selection.

Lastly we creating separate buttons which is "Send Feedback" and "Reset" Button with the help of input tags that consists of type and value.

So That's all we have created an feedback form using simple HTML . Now We can take a preview of our project in the mentioned output section.

Now We have Successfully created our Feedback Form Using HTML Code. You can use this project for your personnel needs and the respective lines of code are given with the code pen link mentioned below.

If you find out this Blog helpful, then make sure to search codewithrandom on Google for Front-end Projects with Source codes and make sure to Follow the Code with Random Instagram page.

REFER CODE - Simon Long

WRITTEN BY - Ragunathan S

Top comments (0)