/
forms.js
98 lines (87 loc) · 3.4 KB
/
forms.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
var Webflow = Webflow || [];
Webflow.push(function () {
// unbind webflow form handling (keep this if you only want to affect specific forms)
$(document).off('submit');
/* Any form on the page */
$('.cf-replacement').submit(function (e) {
e.preventDefault();
const $form = $(this); // The submitted form
const $submit = $('[type=submit]', $form); // Submit button of form
const buttonText = $submit.val(); // Original button text
const buttonWaitingText = $submit.attr('data-wait'); // Waiting button text value
const formMethod = $form.attr('method'); // Form method (GET/POST)
const formAction = $form.attr('action'); // Form action (your Xano endpoint URL)
const formRedirect = $form.attr('data-redirect'); // Form redirect location
// if we're editing
// const xanoID = document.getElementById('id').value // getting the ID of the record to edit
// let requestURL = formAction.concat(xanoID + "?")
const formData = new FormData($form.get(0)); // Form data
// console.log(formData) // log request URL to console
// Set waiting text
if (buttonWaitingText) {
$submit.val(buttonWaitingText);
}
let submission = new Promise(function (resolve, reject) {
// Get the form data from the event object
let obj = {};
let email;
let entries = [...formData.entries()];
entries.forEach((entry) => (obj[entry[0]] = entry[1]));
email = obj["email"];
delete obj.email;
// Get UTM cookie data
let cookies = document.cookie.split(';');
let utmData = {};
cookies.forEach(cookie => {
let [name, value] = cookie.split('=').map(s => s.trim());
if (name.includes('utm') || name.includes('gclid')) {
utmData[name.replace('_last', '')] = decodeURIComponent(value);
}
});
// Send data to Segment
analytics.identify(analytics.user().anonymousId(), {
email: email,
last_form_submission_confirmation_url: obj["last_form_submission_confirmation_url"],
last_form_submission_name: $form.get(0).attributes[2].nodeValue,
last_submission_url: document.URL
});
analytics.track("Form Submission", {
form_name: $form.get(0).attributes[2].nodeValue,
email: email,
fields: obj,
url: document.URL,
context: {
campaign: {
...utmData,
}
}
});
// Add email to local storage
localStorage.setItem('email_given', email);
setTimeout(function () {
resolve('Success!');
}, 1000);
});
submission.then(function (result) {
// If form redirect setting set, then use this and prevent any other actions
if (formRedirect) { window.location = formRedirect; return; }
$form
.hide() // optional hiding of form
.siblings('.w-form-done').show() // Show success
.siblings('.w-form-fail').hide(); // Hide failure
// If submitting a form to allow for /tools usage
if ($('.tool-popover_component').hasClass('tool-popover_component')) {
$('.tool-popover_component').hide();
}
}).catch(function (error) {
console.log(error);
$('.error-message-text').text(error);
$form
.siblings('.w-form-done').hide() // Hide success
.siblings('.w-form-fail').show(); // show failure
}).finally(function () {
// Reset text
$submit.val(buttonText);
});
});
});