How do I programmatically access my Form Data Model's JSON schema to feed to my React Adaptive Forms component?

[JoeMa24]

I'm trying to get a proof-of-concept working for a headless consumer of AEM Adaptive Forms.

I'm using this starter React project: https://github.com/adobe/react-starter-kit-aem-headless-forms

I've created a Form Data Model in my local author instance running on localhost:4502 via the schema in that repo, and uploaded it as form-model.schema.json.

I can access something that looks vaguely like a schema at 

http://localhost:4502/content/dam/formsanddocuments-fdm/application-form-data-model.schema.json

As well as what seems like a high level description of the Adaptive Form I'm using with the path 

http://localhost:4502/content/forms/af/application-forms/peak-application-form/jcr:content/guideCont...

My question is: How do I programmatically access the schema I just uploaded from the React repo? What's the path to the JSON? Can I do it on the author instance or do I need to stand up a publish instance as well?

The README from the repo says that the URI

/content/forms/af/application-forms/peak-application-form/jcr:content/guideContainer.model.json

should work but that returns me an error.

Any help would be much appreciated! Haven't found anything useful in the docs.

[Rahul_P]

Hello @JoeMa24 

Yes, you can fetch the schema from your author instance.

You can programmatically fetch the JSON schema of a Form Data Model or Adaptive Form using an HTTP GET request.

AEM provides RESTful APIs that allow you to retrieve form definitions in JSON format.

To fetch the JSON structure of an Adaptive Form, you can append .model.json to the URL of your form.
For example:
GET http://[server]:[port]/content/forms/af/[form-name].model.json

This will return the JSON representation of the Adaptive Form.

Sample code is at: https://experienceleague.adobe.com/en/docs/experience-manager-learn/forms/embed-form-spa/fetch-the-f...

Thanks,

Rahul Pandey

[JoeMa24]

So @rahulpandey 

 

 I'm trying to use the URL example you provided but it's giving me "No Resource Found"

http://localhost:4502/content/forms/af/peak-application-form.model.json

Where "peak-application-form" is the name of my Adaptive Form.

Is there something I'm missing? I should say this is on AEM Cloud as a Service.

[JoeMa24]

I should say when I include the folder path, I get some kind of JSON - but this doesn't look anything like the Adaptive Form Schema I uploaded.

http://localhost:4502/content/forms/af/application-forms/peak-application-form.model.json

 

[ShraddhaSi]

Hi @JoeMa24 

Can you please check a path like this for the JSON schema :

http://localhost:4502/content/forms/af/<form-name>/jcr:content/guideContainer.guidejson
In your case I suppose it should be like this: 
http://localhost:4502/content/forms/af/application-forms/peak-application-form/jcr:content/guideCont...


Kindly check the folder in which the form is created.

Thanks, 
Shraddha Singh

[kautuk_sahni]

@JoeMa24 Did you find the suggestions helpful? Please let us know if you need more information. If a response worked, kindly mark it as correct for posterity; alternatively, if you found a solution yourself, we’d appreciate it if you could share it with the community. Thank you!