HTML Form

• ✔️
  Create a semantic HTML form

  Learn how to create a form in HTML using the <form> tag.

Form structure

To create a form in HTML, you need to use the <form> tag.

The <form> tag is used to create an HTML form for user input.

The form can contain input elements like text fields, checkboxes, radio-buttons, submit buttons, and more.

The Task form will have the following fields:

• Task title
• Task description

Note

The Task interface includes 2 more properties: id and createdAt. Their values will be generated upon the form submission later on by the application, not the user.

The form also includes a submit button to create the new task based on the form values.

🎓 Instructions

1. Update the src/app/task-form/task-form.component.html file.

   task-form.component.html

   <form>
   
       <label for="title" class="form-label">Title</label>
       <input type="text" id="title" name="title" class="form-control">
   
   
           <label for="description" class="form-label">Description</label>
           <textarea id="description" name="description" class="form-control"></textarea>
   
   
           <button type="submit" class="btn btn-primary">Create task</button>
   </form>

✔️ What you learned

In this chapter, you learned how to create a basic form in HTML. This HTML interlude wil be bound to Angular in the next steps.