[ANGULAR] Set Error in grid cell
Hi,
Suppose i have cell x and i am editing cell X, after editing of cell X i want to setError in cell Y. Is is possible to do so, i don't want to use renderer function.
Hi,
Suppose i have cell x and i am editing cell X, after editing of cell X i want to setError in cell Y. Is is possible to do so, i don't want to use renderer function.
If I understood you correctly, you want to have validation is some cell editor that will check as well the value of another field of the record. Of course that's possible to do since you have an access to the record.
Try to call https://bryntum.com/docs/grid/api/Grid/feature/CellEdit#function-startEditing for the Y cell in https://bryntum.com/docs/grid/api/Grid/column/Column#config-finalizeCellEdit of the X cell.
To set error: https://bryntum.com/docs/grid/api/Core/widget/Field#function-setError
That would validate the input in a cell edit situation. Not sure of the exact requirement, but it seems the poster wants to apply a rendition to a cell.
To affect how the code renders a cell to make it customized to you own requirements, Your code have to get involved somewhere.
This would be a renderer:
renderer : ({ cellElement, record, column }) => {
// Interrogate the record (maybe based on the column) to see if it is invalid.
cellElement.classList.toggle('cell-invalid', cellIsInvalid);
}
alex.l wrote: ↑Fri Nov 26, 2021 12:30 pmIf I understood you correctly, you want to have validation is some cell editor that will check as well the value of another field of the record. Of course that's possible to do since you have an access to the record.
Try to call https://bryntum.com/docs/grid/api/Grid/feature/CellEdit#function-startEditing for the Y cell in https://bryntum.com/docs/grid/api/Grid/column/Column#config-finalizeCellEdit of the X cell.
To set error: https://bryntum.com/docs/grid/api/Core/widget/Field#function-setError
I want to set error on cell y once edit of cell x completed. It will be great if you can share sample code as well.
A renderer is the only way to do it.
Hi Animal,
Tried with same but renderer is working differently. Don't know how to fix. Please refer post below for same(used renderer).
It appears to be a different topic. I looked at that thread and I do not understand anything there.
To simply answer the question in this thread: To change the appearance of a cell, you must use a renderer
for that Column
.
Hi Animal,
Tried with
renderer
but there is some issue with
renderer
. Please check video for ref, it show previous selected value in other cell.
I cannot gain any insight into a potential problem from the description "some issue"
I cannot parse any meaning out of a video.
What is the requirement?
What does the code look like that you have currently attempted to implement this requirement?
Hi,
My requirement is
I have two column progress
and actualDate
, whenever i edit progress
after editing i should show error like actualDate
is required and if progress
value is greater than 100 actualDate
field should get disabled. And on load actualDate
field might present or might not present. For some line item actualDate
might be undefined. I tried below code. Please have a look into renderer function.
Issue when i edit cell of lineItem1 progress
first time actualDate
is showing correct, when i complete edit of lineItem2 progress
when you will click on actualDate it shows default value of actualDate
field of lineItem1, ideally it should show empty because for lineItem2 there is no value present for actualDate
renderer: ({ cellElement, row, record, value, column }) => {
let { id } = column;
const { progress = '', trackedBy = '', actualStartDate, serialNumber } = record;
if (!isValidDate(value)) {
cellElement.style.color = 'transparent';
}
if (
(Number(progress) > 0 || isItemComplete({ progress, quantity: record?.measure?.value, trackingMethod: trackedBy })) &&
!isValidDate(actualStartDate) &&
record.trackable !== 'ROLLUP'
) {
cellElement.classList.add('cell-focused');
requiredValidationMessage({ serialNumber, _id: id });
return '';
}
if (!isProgressValue({ progress, quantity: record?.measure?.value, trackingMethod: trackedBy })) {
cellElement.classList.add('disabled-field');
}
if (isValidDate(value)) {
removeRequireValidation({ serialNumber, _id: id });
cellElement.style.color = '#4a4a4a';
}
return (value && moment(value).format('DD/MM/YYYY')) || '';
}