Appointment Form V07

Author: Colorlib

Released: September 2026

License: CC BY 3.0

A lesson booking form for a tutoring service with subject chips, a segmented level picker and lesson lengths whose prices follow the chosen level. Choosing a preferred weekday suggests the next matching first-lesson date and keeps the date on that weekday. A repeat-weekly switch reveals a weeks stepper and a preview of every lesson date, and the summary multiplies the per-lesson price by the weeks with a small bundle discount.

It is plain HTML and CSS plus a few lines of vanilla JavaScript: no jQuery, no Bootstrap files, no plugins, and the download is 175 KB. Use it on its own, or drop it into a Bootstrap 4, 5 or 6 project and it looks the same.

• Subject chips, segmented level control and length cards as real radios
• Lesson prices recalculated from the level's hourly rate
• Weekday choice sets the first date and a 7-day step rule
• Repeat-weekly stepper with a generated list of lesson dates
• 5% bundle discount from 4 weeks and 10% from 8 weeks
• Inline validation with focus moved to the first problem