-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
128 lines (105 loc) · 4.25 KB
/
index.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
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>
<title>SeoulTech needs you</title>
<link href='http://fonts.googleapis.com/css?family=Questrial' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="style.css">
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="./polyfill/extras/modernizr-custom.js"></script>
<script src="./polyfill/polyfiller.js"></script>
<script>
webshims.polyfill('forms');
</script>
</head>
<body>
<header>
<img src="banner.png" alt="Seoul Tech Society">
</header>
<article>
<p>Great news! Seoul Tech Society has started the application process to become a non-profit status organization in Korea.</p>
<h3>What this means to you?</h3>
<p>An official status will allow us to improve quality of our events by taking sponsorships. It means we will be able to provide free snacks, drinks, rent spaces for our events and do other cool things.</p>
<h3>How you can help?</h3>
<p>The registration process requires us to provide our membership list containing contact information. Please take a moment to add yourself to the official contact list.</p>
<form action="">
<label for="name">First Name</label><br>
<input id="name"
type="text"
pattern="^\S[\s\-A-Za-z\u3130-\u318F\uAC00-\uD7AF]+$"
title="Please use only English or Korean letters"
placeholder="First Name"
required><br>
<label for="surname">Last Name</label><br>
<input id="surname"
type="text"
pattern="^\S[\s\-A-Za-z\u3130-\u318F\uAC00-\uD7AF]+$"
placeholder="Last Name"
title="Please use only English or Korean letters"
required><br>
<label for="phone">Phone Number</label><br>
<input id="phone"
type="tel"
pattern="[0-9\-]{9,}"
placeholder="xxx-xxxx-xxxx"
title="Please use only numbers and dashes"
required><br>
<label for="email">Email</label><br>
<input id="email"
type="email"
pattern="^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$"
placeholder="you@domain"
required><br>
<label for="address">Home Address</label><br>
<input id="address"
type="text"
pattern="^\S[0-9\,\.\\\/\s\-A-Za-z\u3130-\u318F\uAC00-\uD7AF]+$"
title="Please fill your address in English or Korean"
placeholder="Home Address"
required><br>
<label for="work">Occupation</label><br>
<input id="work"
type="text"
pattern="^\S[0-9\,\.\\\/\s\-A-Za-z\u3130-\u318F\uAC00-\uD7AF]+$"
placeholder="Occupation"
required><br>
<label for="comment">Comment</label><br>
<input id="comment"
type="text"
pattern="^\S[0-9\,\.\\\/\s\-A-Za-z\u3130-\u318F\uAC00-\uD7AF]+$"
title="If you have comment about SeoulTech, please fill here in English or Korean"
placeholder="Comment"><br>
<button>Submit!</button><br>
</form>
<h3>Statement of Privacy</h3>
<p>We recognize how important privacy is, and it is our priority to completely respect yours. We learned that disclosing our member list to the approving government agency is a routine practice. However, if you feel uncomfortable about sharing your information with SeoulTech, you are more than welcome to opt-out of the contact list.</p>
</article>
<script>
$(document).ready(function () {
$('form').submit(function(event) {
event.preventDefault();
var values = $('form').children('input').map(function() {
return $(this).val()
});
$('input:invalid').attr('class', 'invalid');
$('input:valid').removeClass('invalid');
if ($('input:invalid').length == 0) {
$.post('https://docs.google.com/forms/d/1jgmpE2rvDcI0AiFf76Ct4qIesfb8cEnfy7mQUB3CVOY/formResponse', {
entry_424778203: values[0],
entry_973320467: values[1],
entry_641040038: values[2],
entry_641118318: values[3],
entry_2013288510: values[4],
entry_1961871555: values[5],
entry_730196090: values[6]
}).always(function() {
alert('You are awesome ' + values[0] + '! Thank you!');
$('form')[0].reset()
})
}
})
});
</script>
</body>
</html>