https://www.atlasroofing.com/resources/js/components/contact-form-latinos.js?v=20261001065826

1document.addEventListener('alpine:init', () => {
2    Alpine.data('contactFormLatinos', (zip) => ({
3        form: {
4            first_name: '',
5            last_name: '',
6            phone_number: '',
7            email: '',
8            zipcode : zip,
9        },
10        message: '',
11        submitting: false,
12        errors: {},
13        formElement: null,
14
15        init() {
16            this.formElement = document.getElementById('contact-form-latinos')
17        },
18
19        validate() {
20            if (this.form.first_name == '' || 
21                this.form.last_name == '' || 
22                this.form.phone_number == '' || 
23                this.form.email == '' || 
24                this.form.zipcode  == '')
25                return false
26            else return true;
27        },
28
29        async submitForm() {
30            const recaptcha = grecaptcha.getResponse()
31
32            if (recaptcha === "") {
33                alert('Error: \nPlease Validate the Recaptcha');
34                return;
35            }
36
37            this.submitting = true;
38            this.errors = {}
39
40            const form = {
41                ...this.form,
42                purpose: 'Spanish Communication',
43                state: '',
44                city: '',
45                country: '',
46                'g-recaptcha-response': recaptcha,
47            };
48
49            const formData = new FormData()
50            for (const key of Object.keys(form)) {
51                formData.append(key, form[key])
52            }
53
54            const url = 'https://api.atlasroofing.com/1.0/Contacts/submitAtlasContactForm'
55
56            try {
57                const rawResponse = await fetch(url, {
58                    method: 'POST',
59                    body: formData,
60                })
61                const response = await rawResponse.json()
62
63                if(rawResponse.status == 200 && response?.success == 1) {
64                    this.$refs.form.reset();
65                    Swal.fire('¡ÉXITO!', '¡Su solicitud ha sido enviada!', 'success');
66                } else {
67                    this.errors = response.messages.errors
68                    this.formElement.scrollIntoView({behavior: "smooth", block: "end", inline: "nearest"});
69                }
70            } catch (error) {
71                console.error({ error })
72            } finally {
73                this.submitting = false
74            }
75        },
76    })
77    )
78})