<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.
js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>
var Type;
var Url;
var Data;
var ContentType;
var DataType;
var ProcessData;
var method;
var page;
jQuery.support.cors = true;
function CallService() {
$.ajax({
type: Type, //GET or POST or PUT or DELETE verb
url: Url, // Location of the service
data: Data, //Data sent to server
contentType: ContentType, // content type sent to server
dataType: DataType, //Expected data format from server
processdata: ProcessData, //True or False
crossDomain: true,
success: function(msg) {//On Successfull service call
ServiceSucceeded(msg); //
},
error: ServiceFailed// When Service call fails
});
}
function ServiceFailed(result) {
alert('Service call failed: ' + result.status + '' + result.statusText);
Type = null; Url = null; Data = null; ContentType = null; DataType = null; ProcessData = null;
}
function UserValidation() {
var username=$("#username").val();
var pwd=$("#password").val();
Type = "POST";
Url = "http://192.162.1.177/CheckInOut/Service1.svc/UserValidation";
Data = '{"username":"980","password":"PMS@123"}';
ContentType ="application/json; charset=utf-8";
DataType = "json"; ProcessData = false;
method = "UserValidation";
CallService();
}
function Getexpctedarrivals() {
Type = "POST";
Url = "http://192.162.1.183/CheckInOut/Service1.svc/Getexpctedarrivals";
ContentType = "application/json; charset=utf-8";
// Data = '{"ResNo": "918"}';
DataType = "json"; ProcessData = false;
method = "Getexpctedarrivals";
CallService();
}
function VacuntRoomStatus() {
Type = "POST";
Url = "http://192.162.1.183/CheckInOut/Service1.svc/VacuntRoomStatus";
ContentType = "application/json; charset=utf-8";
Data = '{"ResNo": "100008","SrlNo":"1","roomtype":"DLX"}';
DataType = "json"; ProcessData = false;
method = "VacuntRoomStatus";
CallService();
}
function ServiceSucceeded(result) {
if (DataType == "json") {
//var string =result.status;
if(result.status=="Success" && page=="login")
{
alert(result.status);
Getexpctedarrivals();
page="Earriavals";
if(page=="Earriavals")
{
window.location="#page2";
//$("#DynamicLst").empty();
}
}
else if(result.length>0 && page=="Earriavals")
{$("#DynamicLst").empty();
for(var i=0; i<result.length;i++) {
var name= result[i].LSTNAM;
//$("#DynamicLst").empty();
$("#DynamicLst").append('<li><a href="#page3" data-transition="flip">'+name+'</a></li>').listview('refresh');
// $("#DynamicLst").listview('refresh');
}
}
else if(page=="roomstatus")
{
$("#cnid").empty();
for(var i=0; i<result.length;i++) {
var room= result[i].ROMNUB;
// var $something= $('<input/>').attr({ type: 'button',name:'btn1', value:room}); //
//$("#cnid").append($something);
//var $something= $("<button>"+room+"</button>");
//var $something= $('<a data-role="button">' + room + '</a>');
//$("#cnid").append($something);
$("#cnid").append('<a href="#page4" data-role="button" data-theme="e" data-inline="true" data-transition="flip" >' +room + '</a>');
$("#cnid").find("a[data-role='button'] ").button();
//$('.ui-page-active').page("destroy").page();
}
}
else
{
alert(result.status);
$("#username").val("");
$("#password").val("");
}
}
}
function ServiceFailed(xhr) {
alert(xhr.responseText);
if (xhr.responseText) {
var err = xhr.responseText;
if (err)
error(err);
else
error({ Message: "Unknown server error." })
}
return;
}
$(document).ready(function(){
$("#Login").click(function(event){
//event.preventDefault();
UserValidation();
});
page="login";
});
$("#Cancel").click(function(event){
event.preventDefault();
$("#username").val("");
$("#password").val("");
});
$("#DynamicLst").click(function(event){
event.preventDefault();
VacuntRoomStatus();
page="roomstatus";
});
});
</script>
</head>
<body>
<div data-role="page" id="first" data-theme="a" >
<div data-role="header">
<h1>Login</h1>
</div><!-- /header -->
<div data-role="content" data-theme="e">
<div data-role="fieldcontain">
<label for="UserName">
UserName
</label>
<input name="" id="username"autofocus placeholder="Enter your UserName" value="" type="text" required="Enter your UserName">
</div>
<div data-role="fieldcontain">
<label for="Password">
Password
</label>
<input name="" id="password" placeholder="Enter your Password" value="" type="password">
</div>
<a data-role="button" id="Login" data-prefetch data-icon="check" data-iconpos="left" autofocus="true" data-theme="b" data-inline="true">
Submit
</a>
<a data-role="button" id="Cancel" data-icon="delete" data-iconpos="left" data-theme="b" data-inline="true">
Cancel
</a>
</div><!-- /content -->
<div data-role="footer">
<h4>Login</h4>
</div><!-- /footer -->
</div>
<div id="page2" data-role="page" data-theme="a">
<div data-role="header" data-theme="c" data-add-back-btn="true">
<h1>Expected Arrivals</h1>
</div>
<div data-role="content" data-theme="e">
<ul data-role="listview" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search arrival list" id="DynamicLst">
<!--<li><a href="#">Acura</a></li>
<li><a href="#">Audi</a></li>
<li><a href="#">BMW</a></li>
<li><a href="#">Cadillac</a></li>
<li><a href="#">Chrysler</a></li>
<li><a href="#">Dodge</a></li>
<li><a href="#">Ferrari</a></li>
<li><a href="#">Ford</a></li>
<li><a href="#">GMC</a></li>
<li><a href="#">Honda</a></li>
<li><a href="#">Hyundai</a></li>
<li><a href="#">Infiniti</a></li>
<li><a href="#">Jeep</a></li>
<li><a href="#">Kia</a></li>
<li><a href="#">Lexus</a></li>
<li><a href="#">Mini</a></li>
<li><a href="#">Nissan</a></li>
<li><a href="#">Porsche</a></li>
<li><a href="#">Subaru</a></li>
<li><a href="#">Toyota</a></li>
<li><a href="#">Volkswagen</a></li>
<li><a href="#">Volvo</a></li>-->
</ul>
</div>
<div data-role="footer" data-theme="a">
<h4>Expected Arrivals</h4>
</div>
</div>
<!-- End: Page 2 -->
<!-- Start Page 3 -->
<div id="page3" data-role="page">
<div data-role="header" data-theme="a">
<h1>Room Status</h1>
</div>
<div data-role="content" data-theme="e" id="cnid">
<ul data-role="listview" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search arrival list" id="lstview">
</ul>
</div>
<div data-role="footer" data-theme="a">
<h4>Room Status</h4>
</div>
</div>
<div id="page4" data-role="page">
<div data-role="header" data-theme="a">
<h1>Guest Registration</h1>
</div>
<div data-role="content" data-theme="e" id="Pvnt4">
<ul data-role="listview" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search arrival list" id="Ul1">
</ul>
</div>
<div data-role="footer" data-theme="a">
<h4>Guest Registration</h4>
</div>
</div>
</body>
</html>