/* Template Name: webadmin - Admin & Dashboard Template Author: Themesdesign Website: https://Themesdesign.com/ Contact: Themesdesign@gmail.com File: Form wizard Js File */ var currentTab = 0; // Current tab is set to be the first tab (0) showTab(currentTab); // Display the current tab function showTab(n) { // This function will display the specified tab of the form... var x = document.getElementsByClassName("wizard-tab"); x[n].style.display = "block"; //... and fix the Previous/Next buttons: if (n == 0) { document.getElementById("prevBtn").style.display = "none"; } else { document.getElementById("prevBtn").style.display = "inline"; } if (n == (x.length - 1)) { document.getElementById("nextBtn").innerHTML = "Submit"; } else { document.getElementById("nextBtn").innerHTML = "Next"; } //... and run a function that will display the correct step indicator: fixStepIndicator(n) } function nextPrev(n) { // This function will figure out which tab to display var x = document.getElementsByClassName("wizard-tab"); // Hide the current tab: x[currentTab].style.display = "none"; // Increase or decrease the current tab by 1: currentTab = currentTab + n; // if you have reached the end of the form... if (currentTab >= x.length) { currentTab = currentTab - n; x[currentTab].style.display = "block"; } // Otherwise, display the correct tab: showTab(currentTab) } function fixStepIndicator(n) { // This function removes the "active" class of all steps... var i, x = document.getElementsByClassName("list-item"); for (i = 0; i < x.length; i++) { x[i].className = x[i].className.replace(" active", ""); } //... and adds the "active" class on the current step: x[n].className += " active"; } // flatpickr flatpickr('#datepicker-basic');