https://mide.global/js/views/view.contact.js

1/*
2Name: 			View - Contact
3Written by: 	Okler Themes - (http://www.okler.net)
4Theme Version:	7.3.0
5*/
6
7(function($) {
8
9	'use strict';
10
11	/*
12	Custom Rules
13	*/
14	
15	// No White Space
16	$.validator.addMethod("noSpace", function(value, element) {
17    	if( $(element).attr('required') ) {
18    		return value.search(/[a-zA-Z0-9À-žа-яА-ЯёЁα-ωΑ-Ω\s\u0621-\u064A\u0660-\u0669 ]/i) == 0;
19    	}
20
21    	return true;
22	}, 'Please fill this empty field.');
23
24	/*
25	Assign Custom Rules on Fields
26	*/
27	$.validator.addClassRules({
28	    'form-control': {
29	        noSpace: true
30	    }
31	});
32
33	/*
34	Contact Form: Basic
35	*/
36	$('.contact-form').each(function(){
37		$(this).validate({
38			submitHandler: function(form) {
39
40				var $form = $(form),
41					$messageSuccess = $form.find('.contact-form-success'),
42					$messageError = $form.find('.contact-form-error'),
43					$submitButton = $(this.submitButton),
44					$errorMessage = $form.find('.mail-error-message'),
45					submitButtonText = $submitButton.val();
46
47				$submitButton.val( $submitButton.data('loading-text') ? $submitButton.data('loading-text') : 'Loading...' ).attr('disabled', true);
48
49				// Fields Data
50				var formData = $form.serializeArray(),
51					data = {};
52
53				$(formData).each(function(index, obj){
54				    data[obj.name] = obj.value;
55				});
56
57				// Google Recaptcha v2
58				if( data["g-recaptcha-response"] != undefined ) {
59					data["g-recaptcha-response"] = $form.find('#g-recaptcha-response').val();
60				}
61
62				// Ajax Submit
63				$.ajax({

64					type: 'POST',
65					url: $form.attr('action'),
66					data: data
67				}).always(function(data, textStatus, jqXHR) {
68
69					$errorMessage.empty().hide();
70
71					if (data.response == 'success') {
72
73						// Uncomment the code below to redirect for a thank you page
74						// self.location = 'thank-you.html';
75
76						$messageSuccess.removeClass('d-none');
77						$messageError.addClass('d-none');
78
79						// Reset Form
80						$form.find('.form-control')
81							.val('')
82							.blur()
83							.parent()
84							.removeClass('has-success')
85							.removeClass('has-danger')
86							.find('label.error')
87							.remove();
88
89						if (($messageSuccess.offset().top - 80) < $(window).scrollTop()) {
90							$('html, body').animate({
91								scrollTop: $messageSuccess.offset().top - 80
92							}, 300);
93						}
94
95						$form.find('.form-control').removeClass('error');
96
97						$submitButton.val( submitButtonText ).attr('disabled', false);
98						
99						return;
100
101					} else if (data.response == 'error' && typeof data.errorMessage !== 'undefined') {
102						$errorMessage.html(data.errorMessage).show();
103					} else {
104						$errorMessage.html(data.responseText).show();
105					}
106
107					$messageError.removeClass('d-none');
108					$messageSuccess.addClass('d-none');
109
110					if (($messageError.offset().top - 80) < $(window).scrollTop()) {
111						$('html, body').animate({
112							scrollTop: $messageError.offset().top - 80
113						}, 300);
114					}
115
116					$form.find('.has-success')
117						.removeClass('has-success');
118						
119					$submitButton.val( submitButtonText ).attr('disabled', false);
120
121				});
122			}
123		});
124	});
125
126	/*
127	Contact Form: Advanced
128	*/
129	$('#contactFormAdvanced').validate({
130		onkeyup: false,
131		onclick: false,
132		onfocusout: false,
133		rules: {
134			'captcha': {
135				captcha: true
136			},
137			'checkboxes[]': {
138				required: true
139			},
140			'radios': {
141				required: true
142			}
143		},
144		errorPlacement: function(error, element) {
145			if (element.attr('type') == 'radio' || element.attr('type') == 'checkbox') {
146				error.appendTo(element.closest('.form-group'));
147			} else {
148				error.insertAfter(element);
149			}
150		}
151	});
152
153	/*
154	Contact Form: reCaptcha v3
155	*/
156	$('.contact-form-recaptcha-v3').each(function(){
157		$(this).validate({
158			submitHandler: function(form) {
159
160				var $form = $(form),
161					$messageSuccess = $form.find('.contact-form-success'),
162					$messageError = $form.find('.contact-form-error'),
163					$submitButton = $(this.submitButton),
164					$errorMessage = $form.find('.mail-error-message'),
165					submitButtonText = $submitButton.val();
166
167				$submitButton.val( $submitButton.data('loading-text') ? $submitButton.data('loading-text') : 'Loading...' ).attr('disabled', true);
168
169				var site_key = $('#google-recaptcha-v3').attr('src').split("render=")[1];
170				grecaptcha.execute(site_key, {action: 'contact_us'}).then(function(token) {
171
172					// Fields Data
173					var formData = $form.serializeArray(),
174						data = {};
175
176					$(formData).each(function(index, obj){
177					    data[obj.name] = obj.value;
178					});
179
180					// Recaptcha v3 Token
181					data["g-recaptcha-response"] = token;
182
183					// Ajax Submit
184					$.ajax({

185						type: 'POST',
186						url: $form.attr('action'),
187						data: data
188					}).always(function(data, textStatus, jqXHR) {
189
190						$errorMessage.empty().hide();
191
192						if (data.response == 'success') {
193
194							// Uncomment the code below to redirect for a thank you page
195							// self.location = 'thank-you.html';
196
197							$messageSuccess.removeClass('d-none');
198							$messageError.addClass('d-none');
199
200							// Reset Form
201							$form.find('.form-control')
202								.val('')
203								.blur()
204								.parent()
205								.removeClass('has-success')
206								.removeClass('has-danger')
207								.find('label.error')
208								.remove();
209
210							if (($messageSuccess.offset().top - 80) < $(window).scrollTop()) {
211								$('html, body').animate({
212									scrollTop: $messageSuccess.offset().top - 80
213								}, 300);
214							}
215
216							$form.find('.form-control').removeClass('error');
217
218							$submitButton.val( submitButtonText ).attr('disabled', false);
219							
220							return;
221
222						} else if (data.response == 'error' && typeof data.errorMessage !== 'undefined') {
223							$errorMessage.html(data.errorMessage).show();
224						} else {
225							$errorMessage.html(data.responseText).show();
226						}
227
228						$messageError.removeClass('d-none');
229						$messageSuccess.addClass('d-none');
230
231						if (($messageError.offset().top - 80) < $(window).scrollTop()) {
232							$('html, body').animate({
233								scrollTop: $messageError.offset().top - 80
234							}, 300);
235						}
236
237						$form.find('.has-success')
238							.removeClass('has-success');
239							
240						$submitButton.val( submitButtonText ).attr('disabled', false);
241
242					});
243
244				});
245			}
246		});
247	});
248
249}).apply(this, [jQuery]);