New tag <order> for drugs doesn't show on view mode

Hi to you all,

I started to implementing the new tag order following the wiki here. I’m able to create an order but it fails in the view mode.

Creating order: create_drug

View mode:

I also found an error in the JavaScript:

Please let me know if you have any ideas how to solve this. Thank you.

cc: @mksd

@lluismf that’s odd. What UI are you rendering this in? You likely need to import the JS and CSS resources that this tag requires, though I thought we had covered that. Maybe you are running an older version of another module that is rendering htmlforms?

Hello @mseaton,

I have made the import that you suggested, but now every time I change the encounter date it reset the drugs and I am not able to create a new drug anymore. Is this expected?

<uiInclude provider="htmlformentry" css="orderWidget.css"/>
<uiInclude provider="htmlformentry" javascript="orderWidget.js"/>

Wrong luis :slight_smile:

1 Like

Oops, sorry @lluismf ! @luis.oliveira - there is code in place that will reset the drug orders if you change the encounter date - it should display a message to that affect and warn you. I’m not sure what you mean by “not able to create a new drug anymore” - that sounds unexpected.

All orders are intended to be placed as of the encounter date on the form, and orders can be a combination of new orders as well as revisions / discontinuations of existing orders, so changes to the encounter date affect which existing orders are available to revise, which is why the widget is reset when this field is changed.

We can evolve this behavior as needed.

Mike

Hello @mseaton,

Yes the restart of the drugs are working as expected, and the message is shown. But button New no longer works. create_drug _02

Just a quick note, the view mode still doesn’t work for me.

@luis.oliveira - this tag is 100% javascript rendered, so if there are issues with how it is behaving (the new button not working, view mode not working, etc), the cause will be found in the JS console in the browser, likely as errors there. Can you open the JS console and have a look and see what it says? Hopefully the answer is straightforward.

Hi @mseaton,

I created an example form, Drugs Test in qa-refapp.

Steps to reproduce

1) Add a new HFE form definition

Create a new HFE form at https://qa-refapp.openmrs.org/openmrs/module/htmlformentry/htmlForms.list image Paste the below HTML definition for the form that gets hooked to the existing ‘Visit Note’ encounter type:

<htmlform>
   <link href="/openmrs/moduleResources/htmlformentry/orderWidget.css?v=2.4.0" type="text/css" rel="stylesheet"/>
   <script src="/openmrs/moduleResources/htmlformentry/orderWidget.js?v=2.4.0" type="text/javascript"></script>
   <style type="text/css">
      .orderwidget-drug-section { padding: 10px; border: 1px dotted black; }
      .order-field { display: inline-block; padding: 0px; }
      .order-field.action { display: block; }
      .order-field.dateActivated { padding-right: 20px; }
      .order-field-label { display: inline-block; padding-right: 5px; vertical-align: middle; }
      .order-field-label:after { content: ""; white-space: pre; }
      .order-field-widget { display: inline-block; }
   </style>
   <encounterDate id="encounterDate" default="now" showTime="true"/>
   <order orderType="131168f4-15f5-102d-96e4-000c29c2a5d7">
      <orderTemplate>
         <orderProperty name="concept"/>
         <orderProperty name="drug"/>
         <orderProperty name="action"/>
         <div style="padding:0px;">
            <orderProperty name="dose" label="Dosing"/>
            <orderProperty name="doseUnits" label=" "/>
            <orderProperty name="frequency" label=" "/>
            <orderProperty name="route" label=" "/>
         </div>
         <div style="padding:0px;">
            <orderProperty name="dateActivated" label="Starting"/>
            <orderProperty name="duration" label="for"/>
            <orderProperty name="durationUnits" label=" "/>
         </div>
         <div style="padding:0px;">
            <orderProperty name="quantity" label="Quantity"/>
            <orderProperty name="quantityUnits" label=" "/>
            <orderProperty name="numRefills" label="Refills"/>
         </div>
         <div style="display:none;">
            <orderProperty name="urgency" value="ROUTINE"/>
            <orderProperty name="dosingType" value="org.openmrs.SimpleDosingInstructions"/>
            <orderProperty name="careSetting" value="OUTPATIENT"/>
         </div>
      </orderTemplate>
   </order>
   <submit/>
</htmlform>
2) Add the form to the ‘Drugs Test’ menu:

Go to https://qa-refapp.openmrs.org/openmrs/formentryapp/forms.page?app=formentryapp.forms :

3) Add a new drug to the system

Go to https://qa-refapp.openmrs.org/openmrs/admin/concepts/conceptDrug.list

4) Open the new form Drugs Test and test

create_druge_03

Note: Its not possible to add a new drug order because some parameters are not there in the qa-refapp and because of that I can not test here if the view mode is working. But its possible to see that after changinfg the date is no longer possible to create a new drug order.

I’ve reproduced this in our PIH system, and have created a ticket to address this here: https://issues.openmrs.org/browse/HTML-781

2 Likes

Hi @mseaton,

I tested the view mode (locally) and it seems to be working fine :slight_smile:. The only other problem is when I try to import the orderWidget.css and the orderWidget.js, they cannot be included as I expected:

Expected:

<uiInclude provider="htmlformentry" css="orderWidget.css"/>
<uiInclude provider="htmlformentry" javascript="orderWidget.js"/>

How it can be done currently:

<link href="/openmrs/moduleResources/htmlformentry/orderWidget.css?v=2.4.0" type="text/css" rel="stylesheet"/>
<script src="/openmrs/moduleResources/htmlformentry/orderWidget.js?v=2.4.0" type="text/javascript"></script>

Please let me know if this is a problem, or if I should use the second option.

cc: @mksd

You’re right, that looks like an oversight due to the fact that these were originally written and tested with a 1.x UI. We should have put them into the appropriate scripts and styles subfolders in htmlformentry.

Any chance this works?

<uiInclude provider="htmlformentry" css="../orderWidget.css"/>
<uiInclude provider="htmlformentry" javascript="../orderWidget.js"/>
1 Like

I tried it locally and it doesn’t seems to work.