Support for UI customizations

[bhch]

Features:

• Setting custom html class names on form elements
• Providing custom text for button labels

---

Possible Solution:

Creating a new keyword called ui for this purpose:

Example:

{
    "type": "object",
    "properties": {
        // ...
    },
    "ui": {
        "htmlClass": "custom-class",
        "addButtonText": "Add key",
        "removeButtonText": "Remove key",
        // etc ...
    }
}

[captain828]

Here are my 2 cents on this:

First of all, I don't think adding UI customization to the JSON schema is the right way

• it feels like a hack: it breaks the separation between data structure definitions and UI, and just moves the JSON schema further away from the spec
• UI customization, in the context of django admin, is usually handled site-wide so this would not be a good solution if JSON fields are used in many models or as part of an admin interface package

Secondly, I think a better approach would be to:

1. remove all styling from the base jsonform classes and limit them purely for logic control
2. add default styling classes that match the default django admin interface
3. these default styling classes should be injected as part of the fieldset creation
4. allow overriding these default classes at the django settings level via a dictionary

So the settings dictionary could be something like this:

JSONFORM_STYLING = [
  	{
		"type": "input_text",
		"classes": "ui input text"
	},
	{
		"type": "button_array_add",
		"classes": "ui button blue"
	}
]

Let me know what you think.

[bhch]

I like what you've proposed and it's probably the better solution for styling.

However, how do we customize only certain elements of the form, e.g. changing the display text of "Add item" or "Add key" buttons?

To illustrate, you might have two arrays: one for "Animals" and other for "Birds". You might want to display "Add Animal" or "Add Bird" text on the respective add buttons.

This seems possible only by keeping this info in the schema.

[captain828]

That is a fair point.

What I was primarily referring to is general/global styling which is what I understood from having that top-level "ui" key.

For the JSON schema styling, it would be better to have style overrides at the property level.
That would, IMO, make it easier to implement and understand.

So each field type could look like:
{ "type": "text", "style": { "classes": "x y z" } }
where style could have extra keys depending on the field type.