-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtest-form.html
83 lines (79 loc) · 2.25 KB
/
test-form.html
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
<!DOCTYPE html>
<html>
<head>
<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<style>
form {
display: flex;
flex-direction: column;
width: 304px;
margin: 2rem auto;
}
input {
margin-bottom: 1rem;
}
button {
margin-top: 1rem;
}
</style>
</head>
<form
id="form"
method="post"
action="https://5xd90nuti9.execute-api.eu-west-1.amazonaws.com/development/multipart"
enctype="multipart/form-data"
>
<label for="firstName">First Name</label>
<input type="text" name="firstName" />
<label for="lastName">Last Name</label>
<input type="text" name="lastName" />
<label for="email">Email Address</label>
<input type="text" name="email" />
<label for="message">message</label>
<input type="text" name="message" />
<input type="file" name="files" multiple />
<div
id="recaptcha"
class="g-recaptcha"
data-sitekey="6Ldf7QIbAAAAAOri4-dJr2SZBJ2D-MLjfH3hbljn"
></div>
<button type="submit">Submit</button>
</form>
<script>
const form = document.getElementById("form");
form.addEventListener("submit", submitForm, true);
function submitForm(event) {
event.preventDefault();
// const formData = new FormData(form);
// const data = {
// firstName: formData.get("firstName"),
// lastName: formData.get("lastName"),
// email: formData.get("email"),
// message: formData.get("message"),
// recaptcha: grecaptcha.getResponse(),
// };
// console.log(Array.from(formData));
fetch(
"https://5xd90nuti9.execute-api.eu-west-1.amazonaws.com/development/multipart",
{
method: "POST",
mode: "cors",
body: new FormData(form),
// body: JSON.stringify(data),
// headers: {
// Accept: "multipart/form-data",
// "Content-Type": "multipart/form-data",
// },
// credentials: "same-origin",
}
).then(
function (response) {
console.log(response.statusText);
},
function (error) {
console.error("Error:", error.message);
}
);
}
</script>
</html>