Sorting a JSONField by adding an index value?

Using Django
1

Hi everyone! I am using a JSONField to store a custom form with field labels/values. I am having an issue when rendering the form. Each time the form gets rendered, the order is changed since I am using a dictionary. I was thinking of adding an extra value to my JSONField just to store an integer, in which I can order by. I am wondering if this is a possible solution, or if there was any other “best” way to keep this form in order.

I have a simple model,

class House(models.Model):
    form = JSONField(default=dict)

Which in my view a json file is loaded into it with a json file as such.

{
    "outside": [
        {
            "fields": [
                {
                    "label": "Pool",
                    "value": ""
                },
                {
                    "label": "Shed",
                    "value": ""
                },
            ],
            "index": 0
        }
    ],

    "inside": [
        {
            "fields": [
                {
                    "label": "Bedrooms",
                    "value": ""
                },
                {
                    "label": "Baths",
                    "value": ""
                },
            ],
            "index": 1
        }
    ],

When the form is rendered in my view, I am using basic logic

house = House.objects.get(id=1)
form = house.form.items()
return render(request, template, context={'form': form}

The json loads fine the first time, with all fields with the label outside leading, and then fields with the label inside right after.

Outside
1.) Pool <input value="">
2.) Shed <input value="">

Inside
1.) Bedrooms <input value="">
2.) Baths <input value="">

Now running a hard page refresh, and printing out the house.form.items() the order is rearranged, and in doing so the template renders the form with inside fields leading, and outside fields following after. I definitely need to keep fields in order every time, so I added the index value, thinking it was a possibility to sort these items every time based off of the index value but really unsure of how to go about this?

2

Your sample shows that your “outside” “fields” are a list - those are sensitive to order. There is no way that Shed should ever appear before Pool.

Is the situation that you’re seeing “inside” before “outside”?
If so, then I’d make that level a list rather than a dict.

3

The field labels never get swapped, (Pool, Shed) & (Bedrooms, Baths).

What gets swapped is the whole “outside” and “inside” keys. So sometimes it looks like this…

{
    "inside": [
        {
            "fields": [
                {
                    "label": "Bedrooms",
                    "value": ""
                },
                {
                    "label": "Baths",
                    "value": ""
                },
            ],
            "index": 0
        }
    ],

    "outside": [
        {
            "fields": [
                {
                    "label": "Pool",
                    "value": ""
                },
                {
                    "label": "Shed",
                    "value": ""
                },
            ],
            "index": 1
        }
    ],

What I would like to do is sort by the index to keep these stationary and always list “outside” before “inside” when rendering this in the template/view.

4

If you want to keep it ordered, make your higher-level structure a list. Perhaps something like:

[
 {
  layer: inside
  fields: [
    ...
  ]
 },
 {
  layer: outside,
  fields: [
    ...
  ]
 }
]
5

I will give it a shot, and do some restructuring. Thank you for the advice!