Background
Prior to OpenMRS version 1.8, the search widgets were written with dojo which involved writing a separate javascript file that extended the parent openmrsSearch for each Openmrs Object if it were to be searchable on w web page, the dojo widgets would fetch all hits in one ajax query which would take sometime making the widgets slow. In 1.8, this was changed by introducing a single and more generic search widget written with jquery with the enhancements below:
How to include a search widget for a domain object in a jsp
This can be relatively trivial if the domain object already has the required methods for the search widgets to work as expected. Let's assume you wish to add an encounter search to you jsp, below is what you need to do.
| Code Block |
|---|
<openmrs:htmlInclude file="/dwr/interface/DWREncounterService.js"/>
<openmrs:htmlInclude file="/scripts/jquery/dataTables/css/dataTables_jui.css"/>
<openmrs:htmlInclude file="/scripts/jquery/dataTables/js/jquery.dataTables.min.js"/>
<openmrs:htmlInclude file="/scripts/jquery-ui/js/openmrsSearch.js" />
<script type="text/javascript">
var lastSearch;
$j(document).ready(function() {
new OpenmrsSearch("findEncounter", true, doEncounterSearch, doSelectionHandler,
[ {fieldName:"personName", header:omsgs.patientName},
{fieldName:"encounterType", header:omsgs.encounterType},
{fieldName:"formName", header:omsgs.encounterForm},
{fieldName:"providerName", header:omsgs.encounterProvider},
{fieldName:"location", header:omsgs.encounterLocation},
{fieldName:"encounterDateString", header:omsgs.encounterDate}
],
{
searchLabel: '<spring:message code="Encounter.search" javaScriptEscape="true"/>',
searchPlaceholder:'<spring:message code="Encounter.search.placeholder" javaScriptEscape="true"/>'
});
});
//The action to take when the user selects an item from the hits in the widget
function doSelectionHandler(index, data) {
document.location = "encounter.form?encounterId=" + data.encounterId + "&phrase=" + lastSearch;
}
//Contains the logic that fetches the hits from the server
function doEncounterSearch(text, resultHandler, getMatchCount, opts) {
lastSearch = text;
DWREncounterService.findCountAndEncounters(text, opts.includeVoided, opts.start, opts.length, getMatchCount, resultHandler);
}
</script>
|
The first four html includes are required because they contain the necessary scripts used by the widgets and the css file for styling.
Next thing is to initialize the widget and there 2 ways to do it, the one used above is one of them which uses a convenience constructor that takes in 4 arguments and the rest of the other widget properties are passed using an array. Below is the other way where all the properties are passed using an array:
| Code Block |
|---|
$j(document).ready(function() {
$j("#elementId").openmrsSearch({
searchLabel:'<spring:message code="General.search"/>',
searchPlaceholder: '<spring:message code="Encounter.search.placeholder" javaScriptEscape="true"/>',
searchHandler: doSearchHandler,
selectionHandler: doSelectionHandler,
fieldsAndHeaders: [ {fieldName:"personName", header:omsgs.patientName},
{fieldName:"encounterType", header:omsgs.encounterType},
{fieldName:"formName", header:omsgs.encounterForm},
{fieldName:"providerName", header:omsgs.encounterProvider},
{fieldName:"location", header:omsgs.encounterLocation},
{fieldName:"encounterDateString", header:omsgs.encounterDate}
]
});
});
|