Access data element value using JavaScript in custom form (Tracker program)

Support - Assistance technique
1

Hi,

I want to create custom form in tracker program, but I’m failing to capture a data element value in a Javascript variable. For example, if I had a data element called age with id M4yNcFOPzE1, how can I capture it’s value in a custom form. var age=…

Thanks,
OM

2

Hi @Orly_MUGWANEZA,
I think you’d need to get all the attributes related to the TEI as JSON and then extract the specific info you need. For example, [server]/api/trackedEntityInstances/TEI-ID.json?program=PROGRAM-ID&fields=attributes[ATTRIBUTE-DISPLAY-NAME,ATTRIBUTE-VALUE]

Hope this helps! ( :

3

Thank you for your prompt response @Gassim, how do I get the TEI-ID inside the custom form before calling that API?

4

You’re welcome! Well, actually, sorry, I don’t think it needs to get this complicated. After you’ve assigned the data elements to the custom data entry form, you’ll be able to add the data element into the form by selecting it from the right side panel. You’ll then see in the HTML source of the form a code similar to this:

<input id="[an-ID]I3hGpaigSZQ-JuTpJ2Ywq5b-val" name="entryfield" title="Age" value="[ Age ]" />

Then for the example you provided you’ll use the selector document.getElementById(“[an-ID]I3hGpaigSZQ-JuTpJ2Ywq5b-val”).value like this:
var age = document.getElementById("[same-ID]I3hGpaigSZQ-JuTpJ2Ywq5b-val").value

5

Hi @Gassim,

The problem is that for this to work the inserted input field has to stay there yet I want to design my own. Surrounding it with an element that has style=“display:none” attribute works but with 300 data elements that I need to retrieve values I can’t do it manually.

Thanks

6

You’re welcome! I have a suggestion and I hope it works. Maybe it will be possible if you use the find all and replace all in a text editor and search for <input id= and replace it with something like <input class="default-input-field" id= and then use the display: none for that class in particular.

However, I would like to ask you actually, would it be possible to copy the inserted id and use it in your custom input field but then delete the original inserted field? :thinking: