initial commit

think-backend.greaterchiangmai.com/public/assets/js/custom/pages/careers/apply.js

@@ -0,0 +1,179 @@
+"use strict";
+
+// Class definition
+var KTCareersApply = function () {
+	var submitButton;
+	var validator;
+	var form;
+
+	// Init form inputs
+	var initForm = function() {
+		// Team assign. For more info, plase visit the official plugin site: https://select2.org/
+        $(form.querySelector('[name="position"]')).on('change', function() {
+            // Revalidate the field when an option is chosen
+            validator.revalidateField('position');
+        });
+
+		// Start date. For more info, please visit the official plugin site: https://flatpickr.js.org/
+		var startDate = $(form.querySelector('[name="start_date"]'));
+		startDate.flatpickr({
+			enableTime: false,
+			dateFormat: "d, M Y",
+		});
+	}
+
+	// Handle form validation and submittion
+	var handleForm = function() {
+		// Stepper custom navigation
+
+		// Init form validation rules. For more info check the FormValidation plugin's official documentation:https://formvalidation.io/
+		validator = FormValidation.formValidation(
+			form,
+			{
+				fields: {
+					'first_name': {
+						validators: {
+							notEmpty: {
+								message: 'First name is required'
+							}
+						}
+					},
+					'last_name': {
+						validators: {
+							notEmpty: {
+								message: 'Last name is required'
+							}
+						}
+					},
+					'age': {
+                        validators: {
+							notEmpty: {
+								message: 'Age is required'
+							}
+						}
+					},
+					'city': {
+                        validators: {
+							notEmpty: {
+								message: 'City is required'
+							}
+						}
+					},
+					'email': {
+                        validators: {
+							notEmpty: {
+								message: 'Email address is required'
+							},
+                            emailAddress: {
+								message: 'The value is not a valid email address'
+							}
+						}
+					},
+					'salary': {
+						validators: {
+							notEmpty: {
+								message: 'Expected salary is required'
+							}
+						}
+					},
+					'position': {
+						validators: {
+							notEmpty: {
+								message: 'Position is required'
+							}
+						}
+					},
+					'start_date': {
+						validators: {
+							notEmpty: {
+								message: 'Start date is required'
+							}
+						}
+					},
+				},
+				plugins: {
+					trigger: new FormValidation.plugins.Trigger(),
+					bootstrap: new FormValidation.plugins.Bootstrap5({
+						rowSelector: '.fv-row',
+                        eleInvalidClass: '',
+                        eleValidClass: ''
+					})
+				}
+			}
+		);
+
+		// Action buttons
+		submitButton.addEventListener('click', function (e) {
+			e.preventDefault();
+
+			// Validate form before submit
+			if (validator) {
+				validator.validate().then(function (status) {
+					console.log('validated!');
+
+					if (status == 'Valid') {
+						submitButton.setAttribute('data-kt-indicator', 'on');
+
+						// Disable button to avoid multiple click 
+						submitButton.disabled = true;
+
+						setTimeout(function() {
+							submitButton.removeAttribute('data-kt-indicator');
+
+							// Enable button
+							submitButton.disabled = false;
+							
+							Swal.fire({
+								text: "Form has been successfully submitted!",
+								icon: "success",
+								buttonsStyling: false,
+								confirmButtonText: "Ok, got it!",
+								customClass: {
+									confirmButton: "btn btn-primary"
+								}
+							}).then(function (result) {
+								if (result.isConfirmed) {
+									//form.submit();
+								}
+							});
+
+							//form.submit(); // Submit form
+						}, 2000);   						
+					} else {
+						// Scroll top
+
+						// Show error popuo. For more info check the plugin's official documentation: https://sweetalert2.github.io/
+						Swal.fire({
+							text: "Sorry, looks like there are some errors detected, please try again.",
+							icon: "error",
+							buttonsStyling: false,
+							confirmButtonText: "Ok, got it!",
+							customClass: {
+								confirmButton: "btn btn-primary"
+							}
+						}).then(function (result) {
+							KTUtil.scrollTop();
+						});
+					}
+				});
+			}
+		});
+	}
+
+	return {
+		// Public functions
+		init: function () {
+			// Elements
+			form = document.querySelector('#kt_careers_form');
+			submitButton = document.getElementById('kt_careers_submit_button');
+
+			initForm();
+			handleForm();
+		}
+	};
+}();
+
+// On document ready
+KTUtil.onDOMContentLoaded(function () {
+	KTCareersApply.init();
+});