jsGrid Dropdown issue

Question

I'm trying to populate a dropdown list in my jsGrid.

I'm retrieving the data using fetch so the data looks like this within the Network Response tab. I then JSON.parse the data before calling showGrid(priority) to display the jsGrid.

JSON

[
  {
    "PRIORITY": "[{\"level\":null,\"value\":null},{\"level\":\"1\",\"value\":\"1\"},{\"level\":\"2\",\"value\":\"2\"},{\"level\":\"3\",\"value\":\"3\"}]"
  }
]


json.forEach(item => {
        priority = JSON.parse(item.PRIORITY);
        showGrid(priority)
      });

function showGrid(priority) {
  jsGrid......

{ name: "priority", align: "center", type: "select", items: priority, textField: priority.level, valueField: priority.value, title: "Priority", inserting: true, validate: "required" },

}

The priority dropdown shows:

[object Object]
[object Object]
[object Object]
[object Object]

How do I get the dropdown to show level/value?

Answer 1

The textField and valueField properties accept names of according properties.

So should be:

{ name: "priority", align: "center", type: "select", items: priority, textField: "level", valueField: "value", title: "Priority", inserting: true, validate: "required" }