Add function to switch content on order.php

790706ae · Husnulzaki Wibisono Haryadi · 51c3b41d · 790706ae · 790706ae
Commit 790706ae authored 7 years ago by Husnulzaki Wibisono Haryadi
--- a/css/order.css
+++ b/css/order.css
@@ -51,10 +51,6 @@
 	float: right;
 }
-#next {
-}
 #select_driver div {	
 	border: 0.5px solid black;
 }

--- a/order/order.php
+++ b/order/order.php
@@ -5,7 +5,6 @@
 	<link rel="stylesheet" type="text/css" href="../css/default_style.css">
 	<link rel="stylesheet" type="text/css" href="../css/order.css">
 	<link rel="stylesheet" type="text/css" href="../css/header.css">
-	<script type="text/javascript"></script>
 </head>
 <body>
 	<div class="frame">
@@ -37,8 +36,8 @@
 				</div>
 			</a>
-			<a href="order/select_driver.html">
+			<a id="xxx">
-				<div class="submenu mid">
+				<div class="submenu mid" id="xxx">
 					Select a Driver
 				</div>
 			</a>
@@ -50,18 +49,20 @@
 			</a>
 		</div>
 		<form method="post">
-			<div class="content" id="select_destination" style="display: none;">
+			<div class="content" id="select_destination">
 				<div>
-					<span>Picking point</span>
+					<div>
-					<input type="text" name="picking_point">
+						<span>Picking point</span>
-				</div>
+						<input type="text" name="picking_point">
-				<div>
+					</div>
-					<span>Destination</span>
+					<div>
-					<input type="text" name="destination">
+						<span>Destination</span>
-				</div>
+						<input type="text" name="destination">
-				<div>
+					</div>
-					<span>Preferred driver</span>
+					<div>
-					<input type="text" name="preferred_driver">
+						<span>Preferred driver</span>
+						<input type="text" name="preferred_driver">
+					</div>
 				</div>
 				<div class="button green" id="next">
 					Next
@@ -78,12 +79,24 @@
 					<input type="text" name="selected_driver">
 				</div>
 			</div>
-			<div class="content" id="complete_order">
+			<div class="content" id="complete_order" style="display: none;">
 				<h2>
 					How was it?
 				</h2>
+				<input class="button green" type="submit" name="submit" value="Complete Order">
 			</div>
 		</form>
 	</div>
+	<script type="text/javascript">
+		var element = document.getElementById('next');
+		// element.onclick = function () {
+		// 	alert('hi');
+		// };
+		element.onclick = function () {
+				document.getElementById('select_destination').style.display='none';
+				document.getElementById('select_driver').style.display='inline';
+			}
+	</script>
 </body>
 </html>