Thanks, it's a bug in the form class. Will look into it and get back to you.
The following view works for me:
'use strict';
'require dom';
'require view';
'require form';
'require request';
let formdata = {
device: [
{
"deviceType" : "speaker",
"hardwareAddress" : "E0:8f:7C:31:00:FF",
"deviceMode" : "fullAccess",
"vendor" : "Marley",
"isIot" : false,
"deviceName" : "Isaiah Gibson",
"deviceLocation" : "Basement"
}, {
"deviceType" : "tv",
"hardwareAddress" : "E1:83:74:3a:CA:FA",
"deviceMode" : "analyzing",
"vendor" : "LG",
"isAdmin" : false,
"deviceName" : "Restroom TV",
"deviceLocation" : "Restroom"
}, {
"deviceType" : "comuter",
"hardwareAddress" : "A0:00:75:CA:FA",
"deviceMode" : "filtering",
"vendor" : "Wemo",
"isIot" : true,
"deviceName" : "Centaurii",
"deviceLocation" : "Kitchen"
}, {
"deviceType" : "thermostat",
"hardwareAddress" : "00:FF:00:FF:CA:FA",
"deviceMode" : "fullAccess",
"vendor" : "Hilo",
"isAdmin" : true,
"deviceName" : "Bob",
"deviceLocation" : "Workshop"
}, {
"deviceType" : "thermostat",
"hardwareAddress" : "AA:FF:60:FF:CA:FA",
"deviceMode" : "fullAccess",
"vendor" : "Huawei",
"isIot" : false,
"deviceName" : "cell phone",
"deviceLocation" : "Unknown"
}
]
};
return view.extend({
load: function() {
// Simulate data loading by returning JSON fixture after 1000ms
return new Promise((resolveFn, rejectFn) => {
window.setTimeout(() => resolveFn(formdata), 1000);
});
},
render: function(data) {
var m, s, o;
m = new form.JSONMap(data, _('Device List'),
_('A List of device and some properties.'));
s = m.section(form.GridSection, 'device', _('Devices'));
s.anonymous = true;
s.addremove = true;
// Workaround uci/get bug by setting config property to
// a uci configuration which is allowed by default ACLs
// and by resetting the modal dialog map data provider
// to the one of the parent JSON map.
m.config = 'luci';
s.addModalOptions = (ss) => { ss.map.data = m.data; };
o = s.option(form.DummyValue, 'hardwareAddress', _('Hardware Address'));
o = s.option(form.ListValue, 'deviceType', _('Device Type'));
o.value("tv", _("Tv"));
o.value("gameConsole", _("Game Console"));
o.value("phone", _("Phone"));
o.value("computer", _("Computer"));
o.value("Printer", _("Printer"));
o.value("thermostat", _("Thermostat"));
o.value("camera", _("Camera"));
o.value("speaker", _("Speaker"));
o.value("other", _("Other"));
o = s.option(form.ListValue, 'deviceMode', _('Device Mode'));
o.value("filtering", _("filtering"));
o.value("analyzing", _("analyzing"));
o.value("noAccess", _("noAccess"));
o.value("fullAccess", _("fullAccess"));
o = s.option(form.Value, 'vendor', _('Vendor'));
o = s.option(form.Value, 'deviceName', _('Device Name'));
o = s.option(form.Flag, 'isIoT', _('Is Iot Device'));
o = s.option(form.Value, 'deviceLocation', _('Device Location'));
return m.render();
},
// Override save action
handleSave: function(ev) {
// Find map instance
var map = document.querySelector('.cbi-map');
// Invoke save method on map (return value may be a promise)
var ret = dom.callClassMethod(map, 'save');
// Resolve save result promise and initiate HTTP POST request with updated formdata
return Promise.resolve(ret).then(() => {
return request.post('https://example.com/myapi/v1', formdata);
});
},
// Disable Save & Apply button
handleSaveApply: null,
// Disable Reset button
handleReset: null
});
The two lines
m.config = 'luci';
s.addModalOptions = (ss) => { ss.map.data = m.data; };
will workaround the uci/get error on pressing Edit
in a grid section row or a JSON map.