Document Actions
Sample eForm HTML
The HTML code for the sample eForm created in the workshop.
Size 6.3 kB - File type text/html
Click here to get the file
File contents
<html>
<head>
<!-- CSS Script that removes textarea and textbox borders when printing -->
<style type="text/css" media="print">
td.subjectline {
display:none;
}
input {
border : 0px;
background: transparent;
font-family: Arial;
font-size: 12px;
}
textarea {
scrollbar-3dlight-color: transparent;
scrollbar-3dlight-color: transparent;
scrollbar-arrow-color: transparent;
scrollbar-base-color: transparent;
scrollbar-darkshadow-color: transparent;
scrollbar-face-color: transparent;
scrollbar-highlight-color: transparent;
scrollbar-shadow-color: transparent;
scrollbar-track-color: transparent;
background: transparent;
overflow: hidden;
border : 0px;
font-family: Arial;
font-size: 12px;
}
</style>
<!-- ------------------------------------------------------------------ -->
<!-- SCRIPT GIVES THE MOUSE COORDINATES----- -->
<script type="text/javascript" language="javascript">
var isIE = document.all?true:false;
if (!isIE) document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = getMousePosition;
document.onclick = captureposition;
var capX = 0;
var capY = 0;
var sy = 0;
var sx = 0;
function getMousePosition(e) {
var _x;
var _y;
if (!isIE) {
_x = e.pageX;
_y = e.pageY;
}
document.title = _x + " " + _y;
return true;
}
function captureposition(e) {
if (e.shiftKey) {
if ((capX == 0) && (capY == 0)) {
capX = e.pageX;
capY = e.pageY;
} else {
var diffX = e.pageX-capX;
var diffY = e.pageY-capY;
if (Math.abs(diffX) > Math.abs(diffY)) {
alert('X-coordinate distance: ' + diffX + 'px');
} else {
alert('Y-coordinate distance: ' + diffY + 'px');
}
capX = 0;
capY = 0;
}
}
}
</script>
<!-- ------------------------------------------- -->
</head>
<body width="750px">
<div style="margin-left: 10px; margin-top: 10px;"><IMG SRC="sample-eform-edited.jpg"></div>
<!-- You can remove ${oscar_image_path} as you develop the form, but make sure you put it back before uploading to OSCAR otherwise the image wouldn't show.
<!-- Also note: the image filename IS CASE SENSITIVE INCLUDING THE EXTENSION. It may work otherwise in Windows, but not in OSCAR because it's based on a Linux platform -->
<form method="POST" action="">
<!-- ----------------------------All textfields/checkboxes/textareas go here...------ -->
<div style="position: absolute; left:140px; top:214px;">
<input type="text" name="eform-sample-name" style="width: 240px;" tabindex="1" oscarDB=patient_name>
</div>
<div style="position: absolute; left:109px; top:235px;">
<textarea name="eform-sample-address" style="height: 35px; width: 270px;" tabindex="2"oscarDB=address></textarea>
</div>
<div style="position: absolute; left:122px; top:274px;">
<input type="text" name="eform-sample-phone" style="width: 130px;" tabindex="1" oscarDB=phone>
</div>
<div style="position: absolute; left:285px; top:274px;">
<input type="text" name="eform-sample-DOB" style="width: 100px;" tabindex="1" oscarDB=DOB>
</div>
<div style="position: absolute; left:86px; top:294px;">
<input type="text" name="eform-sample-HIN" style="width: 180px;" tabindex="1" oscarDB=HIN>
</div>
<div style="position: absolute; left:300px; top:294px;">
<input type="text" name="eform-sample-sex" style="width: 25px;" tabindex="1" oscarDB=sex>
</div>
<div style="position: absolute; left:397px; top:218px;">
<textarea name="eform-sample-cliniclabel" style="height: 115px; width: 205px;" tabindex="2" oscarDB=clinic_label></textarea>
</div>
<div style="position: absolute; left:83px; top:368px;">
<input type="checkbox" name="eform-sample-check-1">
</div>
<div style="position: absolute; left:83px; top:388px;">
<input type="checkbox" name="eform-sample-check-2">
</div>
<div style="position: absolute; left:83px; top:408px;">
<input type="checkbox" name="eform-sample-check-3">
</div>
<div style="position: absolute; left:83px; top:428px;">
<input type="checkbox" name="eform-sample-check-4">
</div>
<div style="position: absolute; left:350px; top:378px;">
<textarea name="eform-sample-freeform" style="height: 125px; width: 260px;" tabindex="2">Here is some sample text to go in the freeform textbox!</textarea>
</div>
<div style="position: absolute; left: 84px; top: 514px;">
<input name="eform-sample-exclusive-radio" type="radio" value="optionA">
</div>
<div style="position: absolute; left: 84px; top: 542px;">
<input name="eform-sample-exclusive-radio" type="radio" value="optionB" checked>
</div>
<div style="position: absolute; left:500px; top:600px;" tabindex="8">
<select name="eform-sample-drop-down">
<option>----</option>
<option>Yes</option>
<option>No</option>
</select>
</div>
<div style="position: absolute; left:290px; top:768px;">
<input type="text" name="eform-sample-form-filler" style="width: 289px;" tabindex="1" value="Dr. Oscardoc">
</div>
<div style="position: absolute; left:218px; top:797px;">
<input type="checkbox" name="eform-sample-origin-stonechurch" checked>
</div>
<div style="position: absolute; left:316px; top:797px;">
<input type="checkbox" name="eform-sample-origin-MUMC">
</div>
<div style="position: absolute; left:382px; top:797px;">
<input type="checkbox" name="eform-sample-origin-MFP">
</div>
<div style="position: absolute; left:433px; top:797px;">
<input type="checkbox" name="eform-sample-origin-other">
</div>
<div style="position: absolute; left:522px; top:796px;">
<input type="text" name="eform-sample-origin-text" style="width: 100px;" tabindex="1">
</div>
<!-- --------------------------------------------------------------------- -->
<!-- The submit/print/reset buttons -->
<div style="position: absolute; top: 922px; left: 27px;">
<table>
<tr>
<td class="subjectline">
Subject: <input type="text" name=subject size="40">
<input type="submit" value="Submit" name="B1">
<input type="reset" value="Reset" name="B2">
<input type=button value=Print onclick="javascript:window.print()">
</td>
</tr>
</table>
</div>
</form>
</body>
</html>