Custom encounter in patinet dashboard


I want to add custom encounter in the patient visits section.

I want to add encounter details/observations from my module here.

I managed to add a link in the general actions area from where the user will be directed to module page where one can add details and save info. Now on ending the visit, the above info should be visible in the area shown in the screenshot.

Can someone please help me with steps to achieve this?

That screen is showing all the Encounters that are in the visit. If your module saves its data as an encounter, it will show up here.

(Also, you should consider using the HTML Form Entry or XForms module, as they both have well-tested and configurable ways of creating encounters.)


I’m still facing troubles about how to use the HTML forms in the module. The documentation is not descriptive enough for me.

In my case, I just have a submit button which uploads files to the server root dir (working). I have created an additional table to keep track of these files with additional details (working).

Now I need to show the uploaded files under encounters section as a list for that particular visit as shown in the screenshot above. The files would be listed either as links for each of these files or a single link to a different page from module where a user can view or modify these files later.

Can you please suggest me how I can achieve this. or a sample module I can peek into?

Are you looking for something like this?

I think yes. Kinda similar.

But in my case, all the observations are stored in the filesystem. I just need to record them as an encounter for the visit and show in the visits along with other encounters. There is no other form data associated with the encounter apart from the visitId, patientId, startDate, endDate, encounterType and ecounterLocation.

I created a custom encounterType. I’m not sure how to create a new encounter and link it to the patient’s visit as an encounter.

Do we have any tutorial for saving encounter without any form?

And yes, I would like to add, this is for the new UI using >2.4 with openMRS(1.11.6) and uicommons(1.7).

Thanks for the reply.

What is the format of the files with observations? Are they xml files or something else? Can i look at a sample?

I think I found what I need to do.

I’m developing a drawing module where along with a canvas (as SVG), a user can attach files like images, videos, notes, audios etc.

For this purpose, I created a fragment. And had a link to the page in current visit actions. But I think this is not the way.

After looking around on wiki, I think I need to create a custom tag handler ex so that I can add the fragment in the HTML form

Ex. I can have a tag in the form as

<drawing id="some_id">

this would, in turn, load the whole fragment in place of the tag.

Please correct me in case I’m missing something.

Now, I have completed the implementation of tag handler but I’m facing issues with activating the module.

I have created another post for this.

please let me know if there is any guide or module which I can have a look at.

On your other post I gave you a link to a module that registers an HTML Form Entry tag. Have you looked at that? Do you have specific questions?

Thanks, Darius. I managed to make that work.

Now I’m trying to figure out a way to uploading and saving the files on the server on submission of the form. There could be several files which need to be uploaded to the server before moving to the patient dashboard.

I’m planning to save the files on the server, so I created Upload and Download controllers for that purpose and they are working from outside the form.

But within HTML form, there could be many other observations along with the files and canvas. And we need to save all of them.

Do you think, this is the right way to go?

I could use some help in this.

In your scenario when the form is submitted are you only saving these images, or are you also saving other observations with the <obs> tag?


But I’m trying to create a generic tag so that the users can use it in their customized forms.

I can have a save button at the bottom of the page which would upload all the required data to the server and save it as an encounter but doing that, it won’t be generic anymore.

Is that making sense…?

Your question makes sense. The problem is that HTML Form Entry doesn’t support saving binary data very well. (At least it didn’t when I last worked on it years ago.)

One option is to have your tag register a hidden value widget, and then use JavaScript before submission to serialize your data into this field, and then deserialize it while processing the submission on the server side.

The javascript hook is described here: and this is a hacky example that does something similar to this (although it hardcodes a field name instead of registering one).

This may also be a way to do what you’re trying to do, but I’m not familiar with it:

I can have a single js function to upload all the required info to the server.

From the looks, I’m not sure if we can make the page wait for the upload to finish, since It’ll be multiple ajax calls, depending on the number and size of files.

Currently, I have a button which saves and uploads data to the server and shows progress in a dialog.

But anyways, I’ll give it a try and see how it goes.

Thanks for the guidance.

@abhijitpparate, hmm, when we were writing most of the HTML Form Entry module, it wasn’t yet prevalent to be writing async and promise-based JavaScript code. It would make sense to improve the pre-validate and pre-submit structure in HFE so that it lets you return Promises and waits for them. (You would need to contribute this improvement.)

Hi Darius,

I’m not sure about that. I don’t think I’m experienced enough to contribute to the community.

I’m learning technologies as required. But sure, I can give it a try if guidance is provided.


Nonsense! You can definitely do something to contribute here! :slight_smile:

What javascript library are you using to do the upload?

Hi @abhijitpparate,

Maybe you can have a look at the module here: Visit Documents UI

Visit Documents UI module allows you to upload files on the server that are attached to a patient and a visit through an encounter (using complex observations)

Then the files are displayed at different places in the app, including the encounter list:

(Check out the documentation on the GitHub repo)

I’m using plain ajax calls to the server and showing progress in a jQuery dialog.

Thank you, @mksrom for sharing the details. I’ll have a look at how they have implemented.