Dynamic Form UI Generation from JSON Schema

This thread is for the discussion of Task 2 of the OpenMRS Android Client: Creation of Form UI from the JSON Schema of forms obtained via the /forms REST resource. This is AC-181 on JIRA for reference.

A sample form JSON can be found here:

@raff will be mentoring this for me.

Thanks!

A GET request to http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/

Gives:

{
  "results": [
    {
      "uuid": "d2c7532c-fb01-11e2-8ff2-fd54ab5fdb2a",
      "display": "Admission (Simple)",
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/d2c7532c-fb01-11e2-8ff2-fd54ab5fdb2a"
        }
      ]
    },
    {
      "uuid": "b5f8ffd8-fbde-11e2-8ff2-fd54ab5fdb2a",
      "display": "Discharge (Simple)",
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/b5f8ffd8-fbde-11e2-8ff2-fd54ab5fdb2a"
        }
      ]
    },
    {
      "uuid": "a007bbfe-fbe5-11e2-8ff2-fd54ab5fdb2a",
      "display": "Transfer Within Hospital (Simple)",
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a007bbfe-fbe5-11e2-8ff2-fd54ab5fdb2a"
        }
      ]
    },
    {
      "uuid": "c75f120a-04ec-11e3-8780-2b40bef9a44b",
      "display": "Visit Note",
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/c75f120a-04ec-11e3-8780-2b40bef9a44b"
        }
      ]
    },
    {
      "uuid": "a000cb34-9ec1-4344-a1c8-f692232f6edd",
      "display": "Vitals",
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd"
        }
      ]
    },
    {
      "uuid": "5f6dd0f7-5c40-4ee5-954c-e7b123f762f4",
      "display": "Vitals XForm",
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/5f6dd0f7-5c40-4ee5-954c-e7b123f762f4"
        }
      ]
    }
  ]
}

Suppose I want Vitals form, so I send a GET on: http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd

The response:

{
  "uuid": "a000cb34-9ec1-4344-a1c8-f692232f6edd",
  "display": "Vitals",
  "name": "Vitals",
  "description": null,
  "encounterType": {
    "uuid": "67a71486-1a54-468f-ac3e-7091a9a79584",
    "display": "Vitals",
    "links": [
      {
        "rel": "self",
        "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/encountertype/67a71486-1a54-468f-ac3e-7091a9a79584"
      }
    ]
  },
  "version": "1.0",
  "build": null,
  "published": true,
  "formFields": [
    {
      "uuid": "76815afc-e81e-4954-acd1-7c53db094b99",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/76815afc-e81e-4954-acd1-7c53db094b99"
        }
      ]
    },
    {
      "uuid": "d5275569-cd94-4836-84fa-544a742f6242",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/d5275569-cd94-4836-84fa-544a742f6242"
        }
      ]
    },
    {
      "uuid": "983e59d4-5bbb-4c60-b7a0-3b00545dc927",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/983e59d4-5bbb-4c60-b7a0-3b00545dc927"
        }
      ]
    },
    {
      "uuid": "8e21349b-d728-447e-91bf-8ca9dc05fc47",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/8e21349b-d728-447e-91bf-8ca9dc05fc47"
        }
      ]
    },
    {
      "uuid": "b5d8e00d-611b-4efe-9df5-73b0a34221f4",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/b5d8e00d-611b-4efe-9df5-73b0a34221f4"
        }
      ]
    },
    {
      "uuid": "e4120df2-72be-41c9-b726-046041f111db",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/e4120df2-72be-41c9-b726-046041f111db"
        }
      ]
    },
    {
      "uuid": "2b7fba7e-6856-4054-8e0f-c016007bedc4",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/2b7fba7e-6856-4054-8e0f-c016007bedc4"
        }
      ]
    },
    {
      "uuid": "130c24f5-0c50-4c38-8775-7ace21a76bfd",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/130c24f5-0c50-4c38-8775-7ace21a76bfd"
        }
      ]
    },
    {
      "uuid": "cc5e2029-05c9-4a36-9e29-a64b2df365cd",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/cc5e2029-05c9-4a36-9e29-a64b2df365cd"
        }
      ]
    },
    {
      "uuid": "f20cb043-20c7-462c-927b-66373d85c75e",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/f20cb043-20c7-462c-927b-66373d85c75e"
        }
      ]
    },
    {
      "uuid": "280e60f7-43fe-4667-a1e1-6beab7ea7e1b",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/280e60f7-43fe-4667-a1e1-6beab7ea7e1b"
        }
      ]
    },
    {
      "uuid": "794882b3-8af9-495d-ad06-6c893a88d4e1",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/794882b3-8af9-495d-ad06-6c893a88d4e1"
        }
      ]
    },
    {
      "uuid": "0ad9fee2-203f-4598-82de-af8ec7b889cf",
      "display": null,
      "links": [
        {
          "rel": "self",
          "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd/formfield/0ad9fee2-203f-4598-82de-af8ec7b889cf"
        }
      ]
    }
  ],
  "retired": false,
  "resources": [
    
  ],
  "links": [
    {
      "rel": "self",
      "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd"
    },
    {
      "rel": "full",
      "uri": "http://devtest04.openmrs.org:8080/openmrs/ws/rest/v1/form/a000cb34-9ec1-4344-a1c8-f692232f6edd?v=full"
    }
  ],
  "resourceVersion": "1.9"
}

The formfields seem to have “null” as their display. How do I get the display type (text/checkbox) and the input header (heart rate, etc) via the API? @raff

Currently, the server has no json forms. Please simply embed a vitals json form within the android app instead of trying to fetch it from the server.

We’ll implement fetching forms from the server in a separate issue. I’ll document requests you need to make in that issue.

@raff @dkayiwa We’re running into this issue once again, the qa refapp does not have forms. I could not understand the code sample Rafal showed me, is there a documentation to create/import forms, atleast the ones that were there in devtest04?

I could find form POST request in the REST docs, do we have to create concepts first and then the forms? Is there a cleaner way around this?

@raff is in charge of devtest04. Did you see his previous advice? “Please simply embed a vitals json form within the android app instead of trying to fetch it from the server.”

That is a plug in solution. My student has already designed the frontend with a sample json response, but ideally we should fetch the form from any server?

By the way how do those forms look like?

@dkayiwa see https://issues.openmrs.org/browse/AC-181 for a sample response.

And how do you create those forms on the server? Am asking because i only knew about how to create xforms and htmlforms. :slight_smile:

Created https://issues.openmrs.org/browse/AC-423

Basically, we do not longer want to create the form manually on the server, rather it should be auto-created by the Android Client if missing.

1 Like

@raff is there a list of concepts and concept ids that we can reference while creating forms? Basically, do you happen to have all the forms that were there in devtest04 so that we can quickly get going by creating them back again if they were missing?

As far as I can see using postman, the other forms (non vital, like Admission, Discharge, etc) are null as well. Could you please confirm this?

Thanks for the help :slight_smile:

@defcon, check AC-423, Raff has described how to create the forms there.

I was able to bring devtest04 partially back (couldn’t start RA). I suspect it got broken by installing some module or changing config (not surprising, because the instance is open to the world).

You can view all the forms at http://devtest04.openmrs.org:8080/openmrs/admin/forms/form.list (save the forms ASAP before it gets broken again)

1 Like