const FieldRenderer = skuid.component.FieldRenderer;
return new FieldRenderer({
readModeStrategy: "element",
read: function (fieldComponent) {
let context = fieldComponent.cpi.getContext(),
{ element, field, model, row, value } = context;
element.innerText = value;
},
editModeStrategy: "element",
edit: function (fieldComponent) {
let context = fieldComponent.cpi.getContext(),
{ element, field, model, row, value } = context;
let input = document.createElement('input');
input.value = value;
element.append(input);
// We'll need some logic here to synchronize the change
// of the **element's value** with the Skuid model
// that element is attached to.
input.addEventListener('change', (event) => {
model.updateRow(row,
{ [field.id]: event.target.value },
{ initiatorId: fieldComponent.id }
);
})
}
});
const FieldRenderer = skuid.component.FieldRenderer;
const $ = skuid.$;
return new FieldRenderer({
readModeStrategy: "element",
read: function (fieldComponent) {
let context = fieldComponent.cpi.getContext(),
{ element, field, model, row, value } = context;
$(element).text(value);
},
editModeStrategy: "element",
edit: function (fieldComponent) {
let context = fieldComponent.cpi.getContext(),
{ element, field, model, row, value } = context;
let input = skuid.$("<input>");
input.val(value);
$(element).append(input);
// We'll need some logic here to synchronize the change
// of the **element's value** with the Skuid model
// that element is attached to.
input.on("change", function (event) {
model.updateRow(row,
{ [field.id]: event.target.value },
{ initiatorId: fieldComponent.id }
);
})
}
});