Source

Mobile POS Front End / ForJieSheng - Copy.html

Full commit
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Mobile POS</title>
    
    <!-- Le styles -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <style type="text/css">
  
    </style>
   </head>
   
   <body>
    <div class="container">
    	<img src="http://placehold.it/940x150" />
   </div>
   <br><br>
   
   <div class="container">
   	<div class="span5 offset2">
     	<form name="loginForm" class="form-horizontal" action="main1 - Copy.html" onSubmit="return checkLoginCredential()"> 
        <!--<form name="loginForm" class="form-horizontal" method="POST" action="http://localhost:8080/QueueManagentSystem_v0.2-war/webresources/helloworld/VerifyUserName" onSubmit"checkLoginCredential()"> -->
  		<div class="control-group">
   			<label class="control-label" for="userEmail">Email</label>
   		 	<div class="controls">
      			<input type="text" name="userEmail" placeholder="Email">
    		</div>
  		</div>
  		<div class="control-group">
    		<label class="control-label" for="userPassword">Password</label>
    		<div class="controls">
      			<input type="password" name="userPassword" placeholder="Password">
    		</div>
  		</div>
  		<div class="control-group">
    		<div class="controls">
      			<label class="checkbox">
        			<input type="checkbox"> Remember me
				</label>
                <button id="loginBtn" type="submit" class="btn btn-large btn-block btn-primary">Login</button>
      			<!--<button id="loginBtn" class="btn btn-large btn-block btn-primary">Login</button> -->
    		</div>
  		</div>
		</form>
   	</div>
   </div>  
   	<!-- jQuery via Google + local fallback, see h5bp.com -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

	<!-- Bootstrap JS: compiled and minified -->
    <script src="js/bootstrap.min.js"></script>
   
   <script>
   
   function checkLoginCredential() {
   		console.log("came login!!");
		
	
		//get the email and password
		var userEmail = document.loginForm.userEmail.value;
		var userPassword = document.loginForm.userPassword.value;
		
	
		
		/**
		JIE SHENG POST REQUEST TO VERIFY USERNAME / PASSWORD 
		
		Steve- can't do a post due to cross origin
		**/
		
		var userInfo = {"userName":"admin","userPassword":"1234"};
		$.ajax({
			type: "POST",
			url: "http://lowe.jschua.com/DinoPos/api/users",
			data: JSON.stringify(userInfo),//userInfo,//JSON.stringify({ userEmailInfo: userInfo}),
			dataType:"json",
			contentType: "application/json; charset=utf-8",
			statusCode:{
				202: function() {console.log("recieve status code 202!");},
				406: function() {console.log("recieve status code 406!");},
			},
			dataType: "text",
			success: function(result){
				console.log("SUCCEED IN POSTING");
				console.log(result);
			},
			error: function(jqXHR,textStatus,errorThrown){
				console.log("the following error occurred: "+textStatus,errorThrown);
			},
			failure: function(errMsg){
				console.log(errMsg);
			}
		});
		
		
		/**
		JIE SHENG GET REQUEST TO GET PRODUCT INFO BASED ON PRODUCT ID
		**/
		$.ajax({
			type:"GET",
			url:"http://lowe.jschua.com/DinoPos/api/products/1",
			dataType:"json",
			success: function(result){
				console.log("Success in getting productID");
				console.log(result);
				console.log(result.Brand);
			},
			error: function(jqXHR,textStatus,errorThrown){
				console.log("the following error occurred: "+textStatus,errorThrown);
			}
		});
		
		
		
		return false;
		
		
   };
   
 
   
   </script>
   
   </body>
   
</html>