Skip to content

Mortalbat/layout_html-form

 
 

Repository files navigation

HTML form

Replace <your_account> with your Github username and copy the links to Pull Request description:

Follow this instructions


The task:

Create HTML page with form. On form submit send form data to https://mate-academy-form-lesson.herokuapp.com/create-application

screenshot

Notes

  • Every field should have name attribute
  • Every field should have label, which focuses input on label click
    • Please add for attribute for each and id to the field (it is important for tests)
  • Do not use tabs. Use 2 spaces for indentation
  • Most of the time you want each tag in new line
  • Form should have different inputs with such types:
    • text
    • number
    • email
    • checkbox
    • radio
    • password
    • range
    • time
    • color
    • date
  • Form should have textarea and select elements.
  • You should use every of this attribute at least one time
    • required
    • min
    • max
    • minlength
    • maxlength
    • multiple
  • The number field should have default value: 12 and maximum value 100.
  • The email field should have placeholder value: [email protected].
  • The text fields should have disabled autocomplete.
  • Add a button which submits the form.
  • Add onsubmit="onSubmit()" attribute to form tag to show form value on submit
  • Vertical distance between inputs should be 10px
  • Vertical distance between blocks with inputs should be 20px
  • Any other styles should be browser default

--> Don't forget to proofread your code using CHECKLIST

Tips & Hints

  1. You can group different input sections with fieldset tag
  2. Make sure you have method and action attributes for form specified correctly
  3. Add onsubmit="onSubmit()" to form tag, not to button. It doesn’t work correctly on buttons.
  4. Follow the code style guide

About

No description, website, or topics provided.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 79.1%
  • HTML 20.0%
  • CSS 0.9%