boost_web_forms_quickstart_text_input_with_submit_handler.ts

1import { BoostForm, TextInput, SubmitButton } from '@boost/web-forms';
2
3// Define the form schema and configuration
4const form = new BoostForm({
5  id: 'contact-form',
6  container: '#form-container',
7  onSubmit: async (data) => {
8    console.log('Form submitted successfully:', data);
9    // Add your API call logic here
10  }
11});
12
13// Add fields to the form
14form.addField(new TextInput({
15  name: 'fullName',
16  label: 'Full Name',
17  placeholder: 'Enter your name',
18  required: true,
19  validation: (value: string) => value.length >= 2 || 'Name is too short'
20}));
21
22form.addField(new SubmitButton({
23  label: 'Send Message'
24}));
25
26// Initialize and render the form
27form.init();