Django app generating forms dynamically from JSON?

Question

I'm creating a Django site and I would like to add dynamically generated forms based on JSON description which will come from an external source.

E.g. something like this:

[
    {
        "name": "first_name",
        "label": "First Name",
        "type": "char",
        "max_length": 30,
        "required": 1
    },
    {
        "name": "last_name",
        "label": "Last Name",
        "type": "char",
        "max_length": 30,
        "required": 1
    },
]

Would then give me a simple Django form with two CharFields which I would display to a user and save the values he/she puts in for further processing.

I searched but didn't find any app creating Django forms from JSON like this. I can write such app myself, I just wanted to know if there is anything already.

If not, do you at least know about any JSON schema format that would allow to describe forms? Again, I can come up with it myself but I wanted to have a look at some examples so I don't omit important possibilities and have something solid to start with.

Thanks!

you can use `django-jsonforms` : https://pypi.org/project/django-jsonforms/ — Ahtisham, Feb 07 '19 at 09:14
https://github.com/collabo-br/django-jsonschema-form or https://github.com/Aristotle-Metadata-Enterprises/django-jsonforms or https://github.com/zbyte64/django-jsonschema — Alex Hall, Feb 07 '19 at 09:16

Ahtisham · Accepted Answer · 2019-02-11T04:34:09.570

10

You can use django-jsonforms like this:

forms.py:

from django.forms import ModelForm, Form
from django_jsonforms.forms import JSONSchemaField

first_name_schema = {
      "type": "object",
      "required": ["First Name"],
      "properties": {
           "First Name": {
                "type": "string",
                "maxLength": 30                 
           }
      }     
    }

last_name_schema = {          
      "type": "object",
      "required": ["Last Name"],
      "properties": {
           "Last Name": {   
                "type": "string",               
                "maxLength": 30,                    
           }
      }
    }

options = {"no_additional_properties": True}

class CustomForm(Form):    
    first_name = JSONSchemaField(schema = first_name_schema, options = options)
    last_name = JSONSchemaField(schema = last_name_schema, options = options)

views.py:

from .forms import CustomForm

def some_view(request):      
    return render(request, 'some_html.html', {'form': CustomForm()})

some_html:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>    
<form id="some_form" action="/path/to/some_view/" method="post">
     {% csrf_token %}
     {{ form.media }}
     {{ form }} 
     <button type="submit">submit</button>           
</form>

for more information visit docs

Edit:

You can remove the extra buttons in your form by modifying your option dictionary like this:

options = {
        "no_additional_properties": True,
        "disable_collapse": True,
        "disable_edit_json": True,
        "disable_properties": True
}

edited Feb 11 '19 at 04:34

answered Feb 07 '19 at 09:24

Ahtisham

9,170
4
43
57

@geckon I edited my answer with your json schema check it out :) – Ahtisham Feb 07 '19 at 16:15
I tried django-jsonforms but the rendered forms have a lot of unnecessary clutter in them (e.g. https://i.imgur.com/hcSTBLG.png). I suppose I can't get rid of the Collapse etc. buttons without modifying the app itself (its template), right? – geckon Feb 11 '19 at 04:18
@geckon you can get rid of those `button` by setting them to False. Check the options section in docs provided for more details. – Ahtisham Feb 11 '19 at 04:26
thanks. I tried your solution and it seems to work. However it will still render the "root" captions etc. Another question though, do you by any chance know why the form data is in HttpRequest.body instead of HttpRequest.POST? – geckon Feb 11 '19 at 20:03
Goto the docs link provided in answer and scroll down to options section you will see all the options. No sorry I don't – Ahtisham Feb 11 '19 at 20:27
@Ahtisham is there a way to read the schema from the db and pass that to the constructor of JSONSchemaField? – Emmanuel Sifakis Aug 23 '20 at 07:03
So can I basically create a form for submitting a JSON file, then in the forms.py read the JSON file, and then use the customForm class to render the uploaded JSON file? – Timothyjames67 Mar 20 '21 at 17:19

Django app generating forms dynamically from JSON?

1 Answers1

Linked