0
Я пытаюсь создать многофазную форму с использованием HTML и JavaScript. В основном на одной фазе моей формы я хочу перенаправить форму, основанную на ответе. Функция возвращает только фазу 3 независимо от того, какой ответ выбран.форму перенаправления на основе ответа
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Make An Appointment</title>
<style>
form#multiphase{border:#000 1px solid; padding:24px; width:350px;}
form#multiphase > #phase2, #phase3, #phase4, #phase5, #show_all_data{display:none;}
</style>
<script>
var FirstName, LastName, catagory;
function _(x){
return document.getElementById(x);
}
function processPhase1(){
FirstName= _("FirstName").value;
LastName= _("LastName").value;
if(FirstName.length>2 && LastName.length > 2){
_("phase1").style.display ="none";
_("phase2").style.display="block";
} else {
alert("Please fill in the fields");
}
}
function gophase1(){
_("phase2").style.display="none";
_("phase1").style.display="block";
}
function processPhase2(){
catagory = _("catagory").value;
if(catagory ="Women"){
_("phase2").style.display = "none";
_("phase3").style.display = "block";
} else if(catagory ="Men"){
_("phase2").style.display = "none";
_("phase4").style.display = "block";
} else if(catagory = "Colour"){
_("phase2").style.display = "none";
_("phase5").style.display = "block";
} else{
alert("Please Choose a catagory");
}
}
</script>
</head>
<body>
<form id="multiphase" onsubmit="return false">
<div id="phase1">
First Name: <input id="FirstName" name="FirstName" /><br />
Last Name: <input id="LastName" name="LastName"/><br />
<button onclick="processPhase1()">Continue</button>
</div>
<div id="phase2">
Select a catagory <select id="catagory" name="catagory">
<option value="Women">Women's Styling</option>
<option value="Men">Men's Styling</option>
<option value="Colour">Colour & Highlights </option>
</select><br />
<button onclick="gophase1()">Back</button>
<button onclick="processPhase2()">Continue</button>
</div>
<div id="phase3">
Select a Style or Treatement women
<button onclick="gophase2()">Back</button>
</div>
<div id="phase4">
Select a Style or Treatment men
</div>
<div id="phase5">
Select a Style or Treatment colour
</div>