1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
|
<html>
<head>
<style>
table {border: 1px dotted gray; padding: 1em;}
</style>
<script language="javascript" src="../jquery/jquery-1.8.2.min.js"></script>
<script language="javascript">
// We keep the resultset in a variable if we want to redraw dynamically
// Size is updated through separate ajax call.
var resultset;
var isvalid=false;
var size=0;
function drawResult()
{
// Use size from initial ajax call
// Generate Table
var output="<table border='1'>";
output+="<tr>";
var matchedbooking,matched;
for(i = 0; i < size; i++) {
matched=false;
for (j = 0; j < resultset.childNodes.length; j++) {
if(resultset.childNodes.item(j).nodeName=="booking"){
var booking=resultset.childNodes.item(j);
if(i==booking.attributes['position'].nodeValue){
matchedbooking=booking;
matched=true;
}
}
}
if(matched){
output+="<td bgcolor='#ffeedd'> </td>";
}else{
output+="<td bgcolor='#ffffff'> </td>";
}
if(i%4==3) output+="</tr><tr>";
}
output+="</tr>";
output+="</table>"
var div=document.getElementById('OutputDiv');
div.innerHTML=output;
}
function ResultBooking(returnedData)
{
// An XML DOM document is returned from AJAX
resultset=returnedData.childNodes[0];
isvalid=true;
drawResult();
}
function ResultSize(returnedData)
{
// An XML DOM document is returned from AJAX
var resultsetsize=returnedData.childNodes[0];
// Iterate over all nodes in root node (i.e. resources)
for (i = 0; i < resultsetsize.childNodes.length; i++) {
if(resultsetsize.childNodes.item(i).nodeName=="resource"){
var resource=resultsetsize.childNodes.item(i);
size=resource.attributes['size'].nodeValue;
}
}
}
function processinputbox()
{
resource=document.getElementById("resourceID").value;
bookingdate=document.getElementById("date").value;
company=document.getElementById("type").value;
$.ajax({
type: 'POST',
url: '../booking/getresourcesize_XML.php',
data: { resourceID: resource},
success: ResultSize
});
$.ajax({
type: 'POST',
url: '../booking/getbookings_XML.php',
data: {
type: company,
resourceID: resource,
date: bookingdate
},
success: ResultBooking
});
}
</script>
</head>
<body>
<form name='searchbookings'>
resourceID:<br><input type='text' name='resourceID' id='resourceID' onchange="processinputbox()" onkeyup="processinputbox()"><br>
company:<br><input type='text' name='type' id='type' onchange="processinputbox()" onkeyup="processinputbox()"><br>
date:<br><input type='text' name='date' id='date' onchange="processinputbox()" onkeyup="processinputbox()"><br>
</form>
<br>
Result<br>
<div id="OutputDiv">
<br>
</body>
</html>
|