-
Notifications
You must be signed in to change notification settings - Fork 0
/
paperform.js
147 lines (113 loc) · 3.45 KB
/
paperform.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
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
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
'use strict'
var paperform = {};
// Initialize
paperform.init = function () {
paperform.post();
}
paperform.loaders = 0;
// Post request
paperform.post = function () {
// Get forms
var forms = document.forms;
for (let i = 0; i < forms.length; i++) {
let form = forms[i];
if (this.isPaperForm(form)) {
let body = '';
let elements = form.elements;
let url = form.getAttribute('paper-post');
// Send form
form.onsubmit = function (e) {
e.preventDefault();
body = new FormData(form);
// Make a ajax request
paperform.postRequest(form, elements, url, body);
// Loader
paperform.setLoader(form);
body = '';
}
}
}
}
// Check the selected form has min requirements of paperform
paperform.isPaperForm = function (form) {
if (form.hasAttribute('paper-post')) {
if (form.getAttribute('paper-post').trim() !== '') {
return true;
}
}
}
// Set loader
paperform.setLoader = function (form) {
if (form.hasAttribute('paper-loader')) {
if (form.getAttribute('paper-loader').trim() !== '') {
paperform.loaders += 1;
form.insertAdjacentHTML('afterbegin', form.getAttribute('paper-loader'));
return true;
}
}
}
// Has loader attribute (default: false)
paperform.removeLoader = function (form) {
if (paperform.loaders > 0) {
form.firstChild.remove();
paperform.loaders -= 1;
}
}
// Display results
paperform.requestDone = function (form, el, speed = 4000) {
if (form.hasAttribute('paper-results')) {
if (form.getAttribute('paper-results').trim() === 'true') {
form.insertAdjacentHTML('afterbegin', el);
// Check speed is set
if (form.hasAttribute('paper-timeout')) {
speed = parseInt(form.getAttribute('paper-timeout'));
}
// Remove element
setTimeout(function () {
form.firstChild.remove();
}, speed);
}
}
}
// Clear inputs
paperform.isInputClear = function (form, elements) {
if (form.hasAttribute('paper-clear')) {
if (form.getAttribute('paper-clear').trim() === 'true') {
for (let j = 0; j < elements.length; j++) {
// Clear inputs
let el = elements[j];
if (el.type == 'text' || el.type == 'file' || el.type == 'email' || el.type == 'number' || el.type == 'textarea') {
el.value = '';
}
}
return true;
}
}
}
// Make Ajax request
paperform.postRequest = function (form, elements, url, body) {
let xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xhr.open('POST', url, true);
let res = xhr.onreadystatechange = function() {
// On success
if (this.readyState == 4 && (this.status == 200 || this.status == 201)) {
paperform.success(form, elements, body, this.responseText);
}
// On error
if(this.readyState == 2 && this.status >= 300 ) {
paperform.fail(form, body, 'error');
}
}
// xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send(body);
}
paperform.success = function (form, elements, body, res) {
paperform.removeLoader(form);
paperform.isInputClear(form, elements);
paperform.requestDone(form, '<div class="alert alert-success">'+res+'</div>');
}
paperform.fail = function (form, body, res) {
paperform.removeLoader(form);
paperform.requestDone(form, '<div class="alert alert-danger">'+res+'</div>');
}
paperform.init();