download-ddr.swp 2.78 KB
<html>
	<head>
		<title>ReportingHub - Download DDR</title>
		<link rel="stylesheet" type="text/css" href="lib/rh/rh.css" />
		<link rel="stylesheet" type="text/css" href="lib/rh/jquery/jquery-ui.css" />
		
		<script type="text/javascript" src="lib/rh/jquery/jquery.js"></script>
		<script type="text/javascript" src="lib/rh/jquery/jquery-ui.js"></script>
		<script type="text/javascript" src="lib/rh/js/rh.js"></script>
		
		<script>
		
			function updateWellBores() {
				// Updates the content of the well bores list based on selected well
				$("#wellSelect option:selected").each(function() {
					updateSelect('#wellBoreSelect', '{= rhspin:GetWellBoresOfWell }', { well: $(this).val() });
				});
			}
			
		</script>
		
	</head>
	<body>
		<div id="wrapper">
			<rhswp:Header />
			
			<div id="content">
			
				<h3>Download a Daily Drilling Report</h3>
				<form action="download-report">
				
					<table>
						<tr>
							<td style="vertical-align: top">
								<div class="formHeader">1. Select Well:</div>
								<select size="10" id="wellSelect" style="width: 200px">
									<ui:forEach ui:resultSet="{#
											SELECT ?well ?wellName
											WHERE {
												GRAPH npdata:npd {
													?well a ep-well:Well .
													?well npd:name ?wellName .
												}
											} ORDER BY ?wellName
										}">
										<option value="{= ?well }">{= ?wellName }</option>
									</ui:forEach>
								</select>
								
								<script>
									$('#wellSelect').change(function() {
										updateWellBores();
									});
								</script>
								
							</td>
							<td></td>
							<td style="padding-left:20px; vertical-align: top">
								<div>			
									<div class="formHeader">2. Select Well Bore:</div>
									<select size="5" id="wellBoreSelect" name="wellboreId" style="width:200px">
									</select>
								</div><br />		
								<div>
									<div class="formHeader">3. Select Date(s):</div>
									<input type="text" id="datepicker1" name="timeFrom" style="width: 90px" />&nbsp;-&nbsp;<input type="text" id="datepicker2" name="timeTo" style="width: 90px" />
									<script>
										$(function() {
											$("#datepicker1").datepicker();
											$("#datepicker2").datepicker();
										});
									</script>
								</div>								
							</td>
							<td></td>
							<td style="padding-left:20px; vertical-align: top">
								<div>			
									<div class="formHeader">4. Select Format:</div>
									<input type="radio" name="format" value="html" checked="checked"/>HTML<br />
									<input type="radio" name="format" value="pdf" />PDF<br />
									<input type="radio" name="format" value="xml" />XML<br />
								</div><br />		
								<input type="submit" value="Download" />			
							</td>
						</tr>
					</table>
				</form>
			</div>
		</div>
	</body>
</html>