Server IP : 150.95.80.236 / Your IP : 3.139.85.170 Web Server : Apache System : Linux host-150-95-80-236 3.10.0-1160.105.1.el7.x86_64 #1 SMP Thu Dec 7 15:39:45 UTC 2023 x86_64 User : social-telecare ( 10000) PHP Version : 7.4.33 Disable Function : opcache_get_status MySQL : OFF | cURL : ON | WGET : OFF | Perl : OFF | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : /var/www/vhosts/pcu.in.th/sc.pcu.in.th/demo15/src/js/custom/modals/ |
Upload File : |
"use strict"; // Class definition var KTModalNewTarget = function () { var submitButton; var cancelButton; var validator; var form; var modal; var modalEl; // Init form inputs var initForm = function() { // Tags. For more info, please visit the official plugin site: https://yaireo.github.io/tagify/ var tags = new Tagify(form.querySelector('[name="tags"]'), { whitelist: ["Important", "Urgent", "High", "Medium", "Low"], maxTags: 5, dropdown: { maxItems: 10, // <- mixumum allowed rendered suggestions enabled: 0, // <- show suggestions on focus closeOnSelect: false // <- do not hide the suggestions dropdown once an item has been selected } }); tags.on("change", function(){ // Revalidate the field when an option is chosen validator.revalidateField('tags'); }); // Due date. For more info, please visit the official plugin site: https://flatpickr.js.org/ var dueDate = $(form.querySelector('[name="due_date"]')); dueDate.flatpickr({ enableTime: true, dateFormat: "d, M Y, H:i", }); // Team assign. For more info, plase visit the official plugin site: https://select2.org/ $(form.querySelector('[name="team_assign"]')).on('change', function() { // Revalidate the field when an option is chosen validator.revalidateField('team_assign'); }); } // 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: { target_title: { validators: { notEmpty: { message: 'Target title is required' } } }, target_assign: { validators: { notEmpty: { message: 'Target assign is required' } } }, target_due_date: { validators: { notEmpty: { message: 'Target due date is required' } } }, target_tags: { validators: { notEmpty: { message: 'Target tags are required' } } }, 'targets_notifications[]': { validators: { notEmpty: { message: 'Please select at least one communication method' } } }, }, 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; // Show success message. For more info check the plugin's official documentation: https://sweetalert2.github.io/ 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) { modal.hide(); } }); //form.submit(); // Submit form }, 2000); } else { // Show error message. 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" } }); } }); } }); cancelButton.addEventListener('click', function (e) { e.preventDefault(); Swal.fire({ text: "Are you sure you would like to cancel?", icon: "warning", showCancelButton: true, buttonsStyling: false, confirmButtonText: "Yes, cancel it!", cancelButtonText: "No, return", customClass: { confirmButton: "btn btn-primary", cancelButton: "btn btn-active-light" } }).then(function (result) { if (result.value) { form.reset(); // Reset form modal.hide(); // Hide modal } else if (result.dismiss === 'cancel') { Swal.fire({ text: "Your form has not been cancelled!.", icon: "error", buttonsStyling: false, confirmButtonText: "Ok, got it!", customClass: { confirmButton: "btn btn-primary", } }); } }); }); } return { // Public functions init: function () { // Elements modalEl = document.querySelector('#kt_modal_new_target'); if (!modalEl) { return; } modal = new bootstrap.Modal(modalEl); form = document.querySelector('#kt_modal_new_target_form'); submitButton = document.getElementById('kt_modal_new_target_submit'); cancelButton = document.getElementById('kt_modal_new_target_cancel'); initForm(); handleForm(); } }; }(); // On document ready KTUtil.onDOMContentLoaded(function () { KTModalNewTarget.init(); });