HTML form - usage of "when" tag issue

I’m using openmrs standalone 2.6.1 on a mac and would like to use the “when” tag but it does not seem to respond as described. In the following if I select 1066/1067 the div is still visible. Any help is appreciated. Following is the html form:

paperFormId = (Fill this in) headerColor =#009d8e fontOnHeaderColor = white
<style>
	.section {
		border: 1px solid $headerColor;
		padding: 2px;
		text-align: left;
		margin-bottom: 1em;
	}
	.sectionHeader {
		background-color: $headerColor;
		color: $fontOnHeaderColor;
		display: block;
		padding: 2px;
		font-weight: bold;
	}
	table.baseline-aligned td {
		vertical-align: baseline;
	}
</style>

<span style="float:right">Paper Form ID: $paperFormId</span>
<h2>sample (v1)</h2>

<section headerLabel="1. Encounter Details">
	<table class="baseline-aligned">
		<tr>
			<td>Date:</td>
			<td><encounterDate default="today"/></td>
		</tr>
		<tr>
			<td>Location:</td>
			<td><encounterLocation default="SessionAttribute:emrContext.sessionLocationId"/></td>
		</tr>
		<tr>
			<td>Provider:</td>
			<td><encounterProvider default="currentUser"/></td>
		</tr>
	</table>
</section>

<section headerLabel="2. Sample Obs">


    <obs id="testObsId" conceptId="48"  labelText="Miscarriage?" answerConceptIds="1065,1066,1067">
        <controls>
            <when value="1065"
                thenJavaScript="htmlForm.simpleUi.showField('form-signed-role-other')"
                elseJavaScript="htmlForm.simpleUi.hideField('form-signed-role-other')"/>
        </controls>
    </obs>
<div id="form-signed-role-other">
    Specify:
    <obs conceptId="5089"/>
</div>

</section>
<submit/>

Do you get any errors on the JavaScript console?

There are no errors in the javascript console. I just created the form in my post on the demo site. The form is titled “testwhen”. You can see there are no errors and nothing happens when the “Miscarriage?” selector is selected.

Which url are you using to access the form?

Am looking at this text: The htmlformentryui module has pages "htmlform/enterHtmlFormWithSimpleUi" and "htmlform/editHtmlFormWithSimpleUi" which include all the JavaScript and CSS for the simple UI

From: https://wiki.openmrs.org/display/projects/Simple+Form+UI

I was following the HTML Form Entry Module HTML Reference at https://wiki.openmrs.org/display/docs/HTML+Form+Entry+Module+HTML+Reference#HTMLFormEntryModuleHTMLReference-<when>

What i mean is that, which application url are you accessing the form with?

I just added the form to the demo site, made it available, browsed to the patient dashboard and attempted to use the form, as below…does this clarify my process so it can be diagnosed? image

What url do you have in the browser?

I hope the following provides the browser url you’re requesting.

The url for html form creation is: https://demo.openmrs.org/openmrs/module/htmlformentry/htmlForm.form?id=6

The url for entering encounter data is: https://demo.openmrs.org/openmrs/htmlformentryui/htmlform/enterHtmlFormWithStandardUi.page?patientId=a2498bc4-fdee-486c-a077-79332a1b1bec&visitId=2a1dca15-3b2d-46bc-b6c5-c5263f800735&formUuid=69d0d6ff-2ce1-4345-a031-6a106af50e84&returnUrl=%2Fopenmrs%2Fcoreapps%2Fclinicianfacing%2Fpatient.page%3FpatientId%3D508%26

Did you get a chance to look at this? https://wiki.openmrs.org/display/projects/Simple+Form+UI

Here is an example of your form: https://demo.openmrs.org/openmrs/htmlformentryui/htmlform/enterHtmlFormWithSimpleUi.page?patientId=fedaa0cb-974c-4258-ba6c-379653c66ab5&visitId=&formUuid=aed2194a-aef3-43c1-beff-5f86f4ca81e9&returnUrl=%2Fopenmrs%2Fcoreapps%2Fclinicianfacing%2Fpatient.page%3FpatientId%3Dfedaa0cb-974c-4258-ba6c-379653c66ab5%26

As a summary of the simple form ui documentation, these are the changes needed on your form:

  1. On this screen, the Diplay Style should be Simple: https://demo.openmrs.org/openmrs/formentryapp/forms/extension.page?formId=6&extensionId=patientDashboard.overallActions.form.6

  2. The div tag should be replaced with the p tag and put inside a fieldset tag

  3. Your section tag should have this attribute: sectionTag=“section”

This is how your form definition should eventually look like: https://demo.openmrs.org/openmrs/module/htmlformentry/htmlForm.form?id=6

@dkayiwa, many thanks!!