Hi everyone,
The requirement is to allow doctors to order lab tests and the lab to give results. Considering the deadlines, I must go to a simple solution, if necessary a temporary solution.
I thought of the following flow : The doctor fills in a ‘Lab Test Order’ form with some tests (Question CIEL:1271, possible answers CIEL:300, CIEL:302…) And then the lab technician edits that form to see the tests ordered and to enter tests results (ie : tests answers for the specific tests concepts). The doctor is then able to look at the form and see the tests results.
(That would apply as well to Medication order, and X-Ray order)
First question:
- Am I looking at it the right way ?
If yes, I want to :
- Displays a drop-down list of all possible answers of a Concept (CIEL:1271 - Tests ordered)
- Add the possibility to click on an “Add” button to add as many tests as I want
- Use the answer to that 1st question (for instance CIEL:300 is an answer to CIEL:1271) to display a field to answer to that last concept (possible answer of CIEL:300 is a numeric value)
I’ve achieved to do (1) with this article : by default the <obs> tag will display a list of all possible answers of a concept.
<obs id="tests" conceptId="CIEL:1271" >
**I've achieved to do (2)** with that [article][2] : there is some JavaScript, combined with the <repeat> tag to add button that displays more lists (however, that is limited to a given number of *obs* and that creates a navigation problem with keyboard Tabulation - but that's ok for now)
*The JavaScript:*
<script type="text/javascript">
if(jQuery){
jQuery(document).ready(function(){
jQuery('#1-removeEntry').remove();
jQuery('#10-addEntry').remove();
jQuery('#1-toggleContainer').show();
jQuery('#11-removeEntry').remove();
jQuery('#20-addEntry').remove();
jQuery('#11-toggleContainer').show();
});
jQuery(document).ready(function(){
jQuery('button.addEntry').live("click", function(){
var correctedAddButtonId = parseFloat(this.id) + 1;
var contentAddId = "#" + correctedAddButtonId + "-toggleContainer";
jQuery(contentAddId).toggle(true);
jQuery('#' + this.id).toggle(false); jQuery('#' + parseFloat(this.id) + '-removeEntry').toggle(false);
return false;});
});
jQuery(document).ready(function(){
jQuery('button.removeEntry').live("click", function(){
var correctedRemoveButtonId = parseFloat(this.id) - 1;
var contentAddId = "#" + parseFloat(this.id) + "-toggleContainer";
jQuery(contentAddId).toggle(false);
jQuery( ':input:not(:button)', contentAddId).val([]);
jQuery('#' + correctedRemoveButtonId + '-addEntry').toggle(true); jQuery('#' + correctedRemoveButtonId + '-removeEntry').toggle(true);
return false;});
});
}
</script>
The markup:
<repeat>
<template>
<div id="{n}-toggleContainer" style="display:none;">
<p>
<obs conceptId="CIEL:1273" labelText="Where"/>
<button id="{n}-addEntry" class="addEntry"><strong>+</strong></button><button id="{n}-removeEntry" class="removeEntry"><strong>-</strong></button>
</p>
</div>
</template>
<render n="1"/>
<render n="2"/>
<render n="3"/>
<render n="4"/>
</repeat>
**Finally, I've achieved to do (3)** with the <when> tag
<p>
<obs id="tests" conceptId="CIEL:1271" >
<controls>
<when value="CIEL:856" thenDisplay="#result-tests" />
</controls>
</obs>
</p>
<span id="result-tests">
<p>
<obs conceptId="CIEL:856" showUnits="true"/>
</p>
</span>
Second question:
- How to put that all together to get the result that I want ? that is put (3) into (2)
Thanks for sharing ideas !
