Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 3 Next »

Some forms are used for retrospective entry and are designed to appear like their paper equivalent as much as possible. Other forms which are primarily for for point-of-care entry should adhere to the following guidelines so that they have a consistent appearance.

Standard Components

Javascript

  • Place all Javascript in a single script block at the top of the page
  • Use jq to reference jQuery

Header

  • Should use .ke-form-header CSS class
  • Should include encounter date, provider and location
  • For forms which are only used for retrospective data entry, encounter date should not request time

Example:

Sections

  • Use <fieldset> and <legend> tags
  • Should use.ke-form-footer CSS class

Example:

Example Template

<htmlform>
	<script type="text/javascript">
		// Client-side initialisation and validation here
	</script>
 
	<div class="ke-form-header">
		<table style="width: 100%; border: 0">
			<tr>
				<td align="left">Enrollment date: <encounterDate id="encounter-date" showTime="true" /></td>
				<td align="center">Enrolled by: <encounterProviderAndRole encounterRole="a0b03050-c99b-11e0-9572-0800200c9a66" default="currentUser" required="true" /></td>
				<td align="right">Enrolled at: <encounterLocation default="GlobalProperty:kenyaemr.defaultLocation" /></td>
			</tr>
		</table>
	</div>

	<fieldset>
		<legend>Section #1</legend>
 
		<!-- Add form sections as fieldsets -->
	</fieldset>	
 
	<div class="ke-form-footer">
		<submit />
	</div>
</htmlform>

 

 

  • No labels