Как вернуться на первый шаг в форме?

Question

[Co11yn]

Есть такая форма - https://msiter.ru/tryit/tryhow_js_form_steps
Если переходить к следующим шагам, там появится кнопка Назад. Как сделать вместо кнопки "Назад", кнопку "Вернуться к первому шагу". И при нажатий был возврат на первый шаг

Answer 1

[Aleksey Solovyev]

// Функция для переключения на определенную вкладку
function toTab(n) {
  // Проверяем, является ли индекс n отрицательным
  if (n < 0) {
    return;
  }

  var x = document.getElementsByClassName("tab");

  // Проверяем, не превышает ли индекс n количество вкладок
  if (n >= x.length) {
    return;
  }

  // Скрыть текущую вкладку:
  x[currentTab].style.display = "none";
  // Устанавливаем новую текущую вкладку
  currentTab = n;
  // Отображаем нужную вкладку:
  showTab(n);
}

<button type="button" id="nextBtn" onclick="toTab(0)">Вернуться к первому шагу</button>

Comments

[Co11yn]

Спасибо, получилось! Очень выручили!
А возможно как-то Кружки, показывающие этапы формы вновь сделать серыми? После нажатия на эту кнопку

[Aleksey Solovyev]

Co11yn, ну... пусть будет так:

function resetStepIndicators() {
  var steps = document.querySelectorAll(".step")
  
  steps.forEach(step => 
  	step.classList.remove("finish", "active")
  )
  
  steps[0].classList.add("active")
}

но лучше переписать fixStepIndicator на что-то другое