Untitled

<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8">
  <link rel="shortcut icon" type="image/x-icon" href="https://production-assets.codepen.io/assets/favicon/favicon-8ea04875e70c4b0bb41da869e81236e54394d63638a1ef12fa558a4a835f1164.ico" />
  <link rel="mask-icon" type="" href="https://production-assets.codepen.io/assets/favicon/logo-pin-f2d2b6d2c61838f7e76325261b7195c27224080bc099486ddd6dccb469b8e8e6.svg" color="#111" />
  <title>LOGIN</title>
  <link rel='stylesheet prefetch' href='css/bootstrap.min.css'>
  <link rel='stylesheet' href='css/login.css' media='screen'>
  <script>
        var dojoConfig = {
            async: true,
            packages: [{
                name: "demo",
                location: location.pathname.replace(/\/[^/]*$/, '') + '/demo'
            }]
        };
   </script>
   <!-- load Dojo -->
   <script src="js/dojo.js" data-dojo-config="async: true"></script>
   <script>
        require([
			'dojo/on',
            'dojo/dom',
			'dojo/request',
			'dojo/dom-style',
            'dojo/domReady!'
        ], function (on, dom, request, domstyle)
        {
			//button events
			var btnlogin=dom.byId('btnlogin');
			on(dom.byId('loginform'),'submit',function(evt){
				event.preventDefault();
				event.stopPropagation();
				request.post("http://localhost/dojo/ajax/loginprocess.php",{
					data:new FormData(this),
				}).then(
				function(response){
					//alert(response);
					var data = response.split('|');
					if(data[0]=='ok'){
						var logindiv = dom.byId("logindiv");
						var infodiv = dom.byId("infodiv");
						var h3username = dom.byId("h3username");
						domstyle.set(logindiv,"display","none");
						domstyle.set(infodiv,"display","block");
						h3username.innerHTML=data[2];
						setTimeout(function () {
							var infodiv = dom.byId("menudiv");
							domstyle.set(infodiv,"display","none");
							domstyle.set(menudiv,"display","block");
						}, 3000);
					}
				},
				function(error){
					alert("error :"+error);
				}
				);
			});

			/*var btnlogin=dom.byId('btnlogin');
			on(btnlogin,"click",function(evt){
				var uname=dom.byId('username').value;
				var pword=dom.byId('password').value;
				event.preventDefault();
				event.stopPropagation();
				request.post("http://localhost/dojo/ajax/loginprocess.php",{
					data:{username:uname,password:pword}
				}).then(
				function(response){
					alert(response);
				},
				function(error){
					alert(error);
				}
				);
			});*/

        });
    </script>
</head>

<body translate="no">
    <div class="wrapper" id="logindiv">
		<form class="form-signin" id="loginform">
		  <h2 class="form-signin-heading">Please login</h2>
		  <input type="text" class="form-control" name="username" id="username" placeholder="Email Address" required="" autofocus="" />
		  <input type="password" class="form-control" name="password" id="password" placeholder="Password" required=""/>
		  <label class="checkbox">
			<input type="checkbox" value="remember-me" id="rememberMe" name="rememberMe"> Remember me
		  </label>
		  <button class="btn btn-lg btn-primary btn-block" type="submit" id="btnlogin">Login</button>
		</form>
	</div>

	<div class="wrapper" id="infodiv">
		<div class="form-signin">
		  <h2 class="form-signin-heading">Welcome</h2>
		  <h3 id="h3username"></h3>
		  <h3 class="form-signin-heading">You will be redirected in 5 seconds.</h3>
		</div>
	</div>

	<div class="wrapper" id="menudiv">
		<div class="form-signin">
		  <h4 class="form-signin-heading"><a href="">Search Customer</a></h4>
		  <input type="text" class="form-control" name=""/>
		  <h4 class="form-signin-heading"><a href="">Search Total Order Value For Customer</a></h4>
		</div>
	</div>


</body>
</html>