tuain-ng-forms-lib 14.4.45 → 14.4.90

package/fesm2020/tuain-ng-forms-lib.mjs

@@ -163,13 +163,13 @@ class FieldComponent extends ElementComponent {
     onChangeContent() { setTimeout(() => this.field?.notifyEditionFinish(), 50); }
     onShowInfo(detail = null) { setTimeout(() => this.field?.notifyEditionDetailRequest(detail), 50); }
     focus() { }
-    updateObject() { this.field?.setValue(this.value); }
+    updateObject(widgetUpdate = true) { this.field?.setValue(this.value, widgetUpdate); }
     inputChanged() {
         this.field?.setValue(this.value);
         this.onChangeContent();
     }
     inputTyped() {
-        this.field?.setValue(this.value);
+        this.updateObject(false);
         this.onInputChange();
     }
     numberInputValidation(event) {
@@ -385,18 +385,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImpor
                 type: Input
             }] } });
 
-const changeViewAttributes = ['visibleRecords', 'currentPage', 'recordsPerPage'];
 class LibTableComponent extends ElementComponent {
     constructor() {
         super(...arguments);
-        this.currentPage = 1;
-        this.globalSearch = false;
         this.globalFilterString = '';
-        // visibleRecords: any[] = [];
-        this.selectedRecords = [];
-        this.totalRecordsNumber = 0;
-        this.allSelected = false;
-        this.layout = '';
         this.loaded = false;
         this.selectable = false;
         this.hasActions = false;
@@ -416,7 +408,7 @@ class LibTableComponent extends ElementComponent {
         this.globalActions = this.table?.getActions(this.formConfig?.tableActions.global);
         this.selectionActions = this.table?.getActions(this.formConfig?.tableActions.selection);
         // Inicialización de campos mapeados del objeto
-        const mapping = Object.entries(this.formConfig?.actionPropagateAttributes);
+        const mapping = Object.entries(this.formConfig?.tablePropagationAttributes);
         for (let index = 0; index < mapping.length; index++) {
             const tableAttr = mapping[index]?.[0];
             const componentAttr = mapping[index]?.[1]?.toString() ?? '';
@@ -430,30 +422,14 @@ class LibTableComponent extends ElementComponent {
             this.defaultProcessAttributeChange(attrName, value);
             this.customProcessAttributeChange(attrName, value);
         });
-        // Suscripción a los cambios de atributos de las columnas
-        // this.table.columns.forEach(column => {
-        //   mapping = this.formConfig?.tableColumnPropagateAttributes;
-        //   for (let index = 0; index < mapping.length; index++) {
-        //     const attrName = mapping[index].toString();
-        //     const attributeValue = column?.[attrName];
-        //     this.defaultColumnAttributeChange(column, attrName, attributeValue);
-        //   }
-        //   column?.attributeChange.subscribe(event => {
-        //     const { name: attrName, value } = event;
-        //     this.defaultColumnAttributeChange(column, attrName, value);
-        //   });
-        // });
         this.start();
     }
-    // defaultColumnAttributeChange(column: any, attribute: string, value?: any) {
-    //   attribute && (column[attribute] = value);
-    // }
     updateTableData() { }
     tableGlobalAction(actionCode) { this.table?.notifyGlobalAction(actionCode); }
     tableSelectionAction(actionCode) { this.table?.notifySelectionAction(actionCode); }
     tableActionSelected(actionEvent) { this.table?.notifyInlineAction(actionEvent); }
     tableSelectionToggle(recordId) { this.table?.notifyRecordSelection(recordId); }
-    toggleSelectAll() { return (this.allSelected) ? this.table?.unSelectAll() : this.table?.selectAll(); }
+    toggleSelectAll() { return (this.table?.allSelected) ? this.table?.unSelectAll() : this.table?.selectAll(); }
     globalFilterCompleted() { this.changePage(1); }
     changePage(requestedPage) { this.table?.changePage(requestedPage); }
     tableColumnSort(columnName, direction = null) { this.table?.sort(columnName, direction ?? 'ascend'); }
@@ -527,14 +503,13 @@ const operators = {
 
 class FormPiece {
     constructor(pieceDefinition, formConfig) {
-        this._attributeChange = new BehaviorSubject(null);
         this._formState = '';
-        this._visible = true;
-        this._disabled = false;
+        this._absoluteVisible = true;
+        this._absoluteDisabled = false;
         this.visibleStates = null;
         this.enabledStates = null;
-        this.visibleOnState = true;
-        this.disabledOnState = false;
+        this._visible = true;
+        this._disabled = false;
         this.customAttributes = {};
         this._formConfig = formConfig;
         this._isForced = false;
@@ -559,10 +534,6 @@ class FormPiece {
         });
     }
     matchAttribute(name, value) { return this.customAttributes?.[name] === value; }
-    get attributeChange() { return this._attributeChange; }
-    propagateAttribute(name, value) {
-        this._attributeChange.next({ name, value });
-    }
     setVisibleStates(newStates) {
         const visibleStates = (!Array.isArray(newStates) && typeof newStates === 'string')
             ? newStates.split(',').map(state => state.trim()).filter(state => state.length > 0)
@@ -577,26 +548,23 @@ class FormPiece {
     }
     viewOnState(state) { return (this.visibleStates && state) ? this.visibleStates.includes(state) : false; }
     enabledOnState(state) { return (this.enabledStates && state) ? this.enabledStates.includes(state) : false; }
+    get absoluteVisible() { return this._absoluteVisible; }
+    get absoluteDisabled() { return this._absoluteDisabled; }
     get visible() { return this._visible; }
     set visible(visible) { this.setVisibility(visible); }
     visibleOn(state) {
-        return this.visible && this.viewOnState(state);
+        return this._absoluteVisible && this.viewOnState(state);
     }
     enabledOn(state) {
-        return !this._disabled && this.enabledOnState(state);
+        return !this._absoluteDisabled && this.enabledOnState(state);
     }
     setVisibility(visible, forced = null) {
-        this._visible = visible && true;
-        this.propagateVisible();
+        this._absoluteVisible = !!visible;
         if (forced !== null) {
             this._isForced = forced;
             this._visibleForced = visible;
         }
-        const formerVisibleOnState = this.visibleOnState;
-        this.visibleOnState = this.visible && this.viewOnState(this._formState);
-        if (formerVisibleOnState !== this.visibleOnState) {
-            this.propagateAttribute('visible', this.visibleOnState);
-        }
+        this._visible = this._absoluteVisible && this.viewOnState(this._formState);
     }
     show(forced = null) {
         this.setVisibility(true, forced);
@@ -604,42 +572,59 @@ class FormPiece {
     hide(forced = null) {
         this.setVisibility(false, forced);
     }
-    get disabled() { return this._disabled; }
     get enabled() { return !this._disabled; }
-    get editable() { return !this._disabled; }
     set enabled(enabled) {
-        this._disabled = !enabled;
-        const formerDisableOnState = this.disabledOnState;
-        this.disabledOnState = this._disabled || !this.enabledOnState(this._formState);
-        if (formerDisableOnState !== this.disabledOnState) {
-            this.propagateDisabled();
-        }
+        this._absoluteDisabled = !enabled;
+        this._disabled = this._absoluteDisabled || !this.enabledOnState(this._formState);
     }
+    get editable() { return !this._disabled; }
+    get disabled() { return this._disabled; }
+    set disabled(disabled) { this.enabled = !disabled; }
     enable() { this.enabled = true; }
     disable() { this.enabled = false; }
+    formStateChangeCustomSubscribe(formChangeSubject) { }
+    formStateChange(state) {
+        if (state) {
+            this._formState = state;
+            this._visible = this._absoluteVisible && this.viewOnState(state);
+            this._disabled = this._absoluteDisabled || !this.enabledOnState(state);
+        }
+    }
     subscribeFormStateChange(formChangeSubject) {
-        this.formStateChangeCustom(formChangeSubject);
-        formChangeSubject.subscribe(event => {
-            const { state } = event ?? {};
-            if (state) {
-                this._formState = state;
-                this.visibleOnState = this.visible && this.viewOnState(state);
-                this.disabledOnState = this._disabled || !this.enabledOnState(state);
-                this.propagateVisible();
-                this.propagateDisabled();
-            }
-        });
+        this.formStateChangeCustomSubscribe(formChangeSubject);
+        formChangeSubject.subscribe(event => this.formStateChange(event?.state));
+    }
+}
+
+const VISIBLE = 'visible';
+const DISABLED = 'disabled';
+class FormPiecePropagate extends FormPiece {
+    constructor(pieceDefinition, formConfig) {
+        super(pieceDefinition, formConfig);
+        this._attributeChange = new BehaviorSubject(null);
     }
-    formStateChangeCustom(formChangeSubject) { }
-    propagateVisible() {
-        this.propagateAttribute('visible', this.visibleOnState);
+    get attributeChange() { return this._attributeChange; }
+    propagateAttribute(name, value) {
+        this._attributeChange?.next({ name, value });
     }
-    propagateDisabled() {
-        this.propagateAttribute('disabled', this.disabledOnState);
+    setVisibility(visible, forced = null) {
+        super.setVisibility(visible, forced);
+        this.propagateAttribute(VISIBLE, this._visible);
+    }
+    set enabled(enabled) {
+        super.enabled = enabled;
+        this.propagateAttribute(DISABLED, this._disabled);
+    }
+    formStateChange(state) {
+        super.formStateChange(state);
+        if (state) {
+            this.propagateAttribute(VISIBLE, this._visible);
+            this.propagateAttribute(DISABLED, this._disabled);
+        }
     }
 }
 
-class FormElement extends FormPiece {
+class FormElement extends FormPiecePropagate {
     constructor(elementDefinition, formConfig) {
         super(elementDefinition, formConfig);
         this.elementType = null;
@@ -797,7 +782,7 @@ class FieldDescriptor extends FormElement {
         this.defaultEditable = this.enabled;
         this.required = fld.required ?? false;
         this.outputOnly = fld.outputOnly ?? false;
-        this.maxLength = fld.maxLength ?? (this._captureType === 'TEXTAREA' ? BIG_MAX_LENGTH : STD_MAX_LENGTH);
+        this.maxLength = fld.maxLength || (this._captureType === 'TEXTAREA' ? BIG_MAX_LENGTH : STD_MAX_LENGTH);
         this.intrinsicErrorMessage = this._formConfig?.fieldValidations?.[this._fieldType]?.message
             ?? this._formConfig?.fieldValidations?.DEFAULT?.message ?? '';
         this.setError(fld.errorCode, fld.errorMessage, fld.errorType ?? DEFAULT_ERROR_TYPE);
@@ -859,7 +844,7 @@ class FieldDescriptor extends FormElement {
     set info(newInfo) { this.setAttr(attrs$1._fieldInfo, newInfo); }
     set intrinsicErrorMessage(message) { this.setAttr(attrs$1._intrinsicErrorMessage, message); }
     get maxLength() { return (this._maxLength > 0) ? this._maxLength.toString() : ''; }
-    set maxLength(requiredMaxLength) { this.setAttr(attrs$1._maxLength, +requiredMaxLength); }
+    set maxLength(requiredMaxLength) { this.setAttr(attrs$1._maxLength, requiredMaxLength ? +requiredMaxLength : null); }
     get maxValue() { return this._maxValue; }
     set maxValue(inputMaxValue) {
         let maxValue = inputMaxValue;
@@ -869,7 +854,7 @@ class FieldDescriptor extends FormElement {
         this.setAttr(attrs$1._maxValue, maxValue);
     }
     get minLength() { return this._minLength; }
-    set minLength(requiredMinLength) { this.setAttr(attrs$1._minLength, +requiredMinLength); }
+    set minLength(requiredMinLength) { this.setAttr(attrs$1._minLength, requiredMinLength ? +requiredMinLength : null); }
     get minValue() { return this._minValue; }
     set minValue(inputMinValue) {
         let minValue = inputMinValue;
@@ -913,7 +898,7 @@ class FieldDescriptor extends FormElement {
                 }
             }
         }
-        if (this._fieldRequired && this._fieldOptions?.length === 1) {
+        if (this._fieldRequired && this._fieldOptions?.length === 1 && this._value !== this._fieldOptions?.[0].fieldOptionId) {
             this._setValue(this._fieldOptions?.[0].fieldOptionId);
             this.notifyEditionFinish();
         }
@@ -1144,6 +1129,7 @@ class RecordTableColumn extends FormPiece {
         this.fieldAlignment = '';
         this.fieldFormat = '';
         this.sortable = true;
+        this.searchable = true;
         this.sortDirections = [];
         // Filtros
         this.filterVisible = false;
@@ -1156,13 +1142,15 @@ class RecordTableColumn extends FormPiece {
             this.fieldType = recTableColReceived.fieldTypeCode || this._formConfig.fieldTypes.text;
             const defaultTypeAlignment = (this._formConfig.tableFieldStyles[this.fieldType] != null) ? this._formConfig.tableFieldStyles[this.fieldType]['text-align'] : 'left';
             this.fieldAlignment = (recTableColReceived.alignment != null) ? recTableColReceived.alignment.toLowerCase() : defaultTypeAlignment;
-            this.visible = recTableColReceived?.visible ?? true;
+            this._absoluteVisible = recTableColReceived?.visible ?? true;
             this.sortable = recTableColReceived?.sortable ?? false;
+            this.searchable = recTableColReceived?.searchable ?? true;
             this.sortDirections = (this.sortable) ? ['ascend', 'descend'] : [];
             this.fieldFormat = recTableColReceived.format || '';
             this.customAttributes = recTableColReceived?.customAttributes ?? {};
         }
     }
+    setSearchable(searchable = true) { this.searchable = searchable; }
     hideFilter() {
         this.filterVisible = false;
     }
@@ -1224,11 +1212,11 @@ class TableAction extends FormPiece {
 
 class TableRecordData {
     constructor(recordReceived, recordDefinition, selectionFieldName = null) {
+        this.recordId = null;
+        this.selected = false;
         this.recordData = {};
         const { tableRecordId, recordData } = recordReceived;
         this.recordId = tableRecordId;
-        this.selected = false;
-        this.recordData = {};
         if (!recordDefinition || recordDefinition.length === 0 || !recordData || recordData.length === 0) {
             return;
         }
@@ -1267,10 +1255,11 @@ class TableRecordData {
         if (!words || words.length === 0) {
             return true;
         }
-        for (const fieldCode in this.recordData) {
-            const columnDef = columnObj?.[fieldCode];
-            if (columnDef && columnDef?.visible && this.recordData.hasOwnProperty(fieldCode)) {
-                for (const word of words) {
+        for (const word of words) {
+            let wordIsPresent = false;
+            for (const fieldCode in this.recordData) {
+                const columnDef = columnObj?.[fieldCode];
+                if (columnDef?.searchable && this.recordData.hasOwnProperty(fieldCode)) {
                     const term = word.toUpperCase();
                     let fieldValue;
                     if (columnDef.fieldType.toUpperCase().includes('DATE')) {
@@ -1280,12 +1269,16 @@ class TableRecordData {
                         fieldValue = this.recordData[fieldCode];
                     }
                     if (fieldValue.toString().toUpperCase().includes(term)) {
-                        return true;
+                        wordIsPresent = true;
+                        break;
                     }
                 }
             }
+            if (!wordIsPresent) {
+                return false;
+            }
         }
-        return false;
+        return true;
     }
     hasCondition(columnFilters) {
         if (!columnFilters || columnFilters.length === 0) {
@@ -1339,7 +1332,7 @@ const attrs = {
     tableCode: { name: 'tableCode', propagate: 'code' },
     clientPaging: { name: 'clientPaging', propagate: null },
     globalSearch: { name: 'globalSearch', propagate: 'globalSearch' },
-    globalFilterString: { name: 'globalFilterString', propagate: null },
+    globalFilterString: { name: 'globalFilterString', propagate: 'globalFilterString' },
     sorting: { name: 'sorting', propagate: null },
     recordsPerPage: { name: 'recordsPerPage', propagate: 'recordsPerPage' },
     layout: { name: 'layout', propagate: 'layout' },
@@ -1360,6 +1353,7 @@ class RecordTable extends FormElement {
         this._tableColumnObj = {};
         this._actionsObj = {};
         // Mecanismos de filtrado nueva versión
+        this.globalFilterString = '';
         this.globalFilterStrings = [];
         this.layout = null;
         this.tableRecordObj = {};
@@ -1398,7 +1392,11 @@ class RecordTable extends FormElement {
         if (tableReceived.fields) {
             const columns = [];
             for (const columnReceived of tableReceived.fields) {
-                const columnEnriched = { ...columnReceived, visibleStates: this.visibleStates };
+                const columnEnriched = {
+                    ...columnReceived,
+                    visibleStates: this.visibleStates,
+                    enabledStates: this.enabledStates
+                };
                 const columnDefinition = new RecordTableColumn(columnEnriched, this._formConfig);
                 columns.push(columnDefinition);
                 this._tableColumnObj[columnDefinition.fieldCode] = columnDefinition;
@@ -1557,7 +1555,6 @@ class RecordTable extends FormElement {
         }
     }
     updateVisibleRecords() {
-        // updateView const changeViewAttributes = ['currentPage', 'recordsPerPage', 'sorting'];
         let visibleRecords;
         if (this.clientPaging) {
             let filteredRecords = this.getFilteredRecords();
@@ -1633,7 +1630,7 @@ class RecordTable extends FormElement {
             this.changePage(1);
         }
         if (notifyComponent) {
-            this.setAttr(attrs.globalFilterString, text);
+            this.setAttr(attrs.globalFilterString, text.trim());
         }
     }
     addFilterDefinition(columnName, filterDefinition) {
@@ -1681,10 +1678,10 @@ class RecordTable extends FormElement {
         for (let index = 0; index < columnFilters.length; index++) {
             const columnFilter = columnFilters[index];
             compactFilter.advancedFilter.push({
-                fieldCode: columnFilter.fieldCode,
-                operator: columnFilter.operator,
-                fieldValue1: columnFilter.values[0],
-                fieldValue2: columnFilter.values[1],
+                fieldCode: columnFilter?.fieldCode,
+                operator: columnFilter?.operator,
+                fieldValue1: columnFilter?.values[0],
+                fieldValue2: columnFilter?.values[1],
             });
         }
         return compactFilter;
@@ -1727,14 +1724,17 @@ class RecordTable extends FormElement {
         }
         return direction === TABLE_SORT_ASCENDING ? result : -result;
     }
-    formStateChangeCustom(formChangeSubject) {
+    formStateChangeCustomSubscribe(formChangeSubject) {
         this.columns?.forEach(column => {
             column?.subscribeFormStateChange(formChangeSubject);
         });
+        this._actions?.forEach(action => {
+            action?.subscribeFormStateChange(formChangeSubject);
+        });
     }
 }
 
-class RecordFormSubSection extends FormPiece {
+class RecordFormSubSection extends FormPiecePropagate {
     constructor(subsectionReceived, formObject, formConfig) {
         super(subsectionReceived, formConfig);
         this._customRender = null;
@@ -1746,6 +1746,7 @@ class RecordFormSubSection extends FormPiece {
         this.subSectionTables = [];
         this.subSectionActions = [];
         this.elementsArray = {};
+        this.active = false;
         if (!subsectionReceived) {
             return;
         }
@@ -1797,9 +1798,22 @@ class RecordFormSubSection extends FormPiece {
     getActionNames() {
         return this.subSectionActions.map(action => action.actionCode);
     }
+    activate() {
+        if (!this.active) {
+            this.active = true;
+            // this.subsectionCode && this._activation.next(this.subsectionCode);
+        }
+    }
+    inactivate() {
+        if (this.active) {
+            this.active = false;
+            // this.subsectionCode && this._inactivation.next(this.subsectionCode);
+        }
+    }
 }
 
-class RecordFormSection extends FormPiece {
+const ACTIVE$1 = 'active';
+class RecordFormSection extends FormPiecePropagate {
     constructor(sectionReceived, formObject, formConfig) {
         super(sectionReceived, formConfig);
         this._activation = new Subject();
@@ -1809,6 +1823,7 @@ class RecordFormSection extends FormPiece {
         this.sectionCode = null;
         this.sectionTitle = null;
         this.subSections = [];
+        this._exclusiveSubSectionsByAttr = {};
         if (!sectionReceived) {
             return;
         }
@@ -1818,20 +1833,12 @@ class RecordFormSection extends FormPiece {
         this.subSections = [];
         this.subSectionsObj = {};
         if (sectionReceived.subsections) {
-            const subsections = sectionReceived.subsections.map(objDef => {
-                let visibleStates = objDef.visibleStates;
-                if (!visibleStates) {
-                    visibleStates = (objDef.subsectionModes || '').split(',')
-                        .map(state => state.trim())
-                        .filter(state => state.length > 0);
-                }
-                if (!visibleStates || visibleStates.length === 0) {
-                    visibleStates = this.visibleStates;
+            const subsections = sectionReceived.subsections.map(subSecDef => {
+                const visibleStates = subSecDef.visibleStates ?? [];
+                if (subSecDef.elements && Array.isArray(subSecDef.elements)) {
+                    subSecDef.elements = subSecDef.elements.map(elm => ({ code: elm.elementCode, type: elm.elementTypeName }));
                 }
-                if (objDef.elements && Array.isArray(objDef.elements)) {
-                    objDef.elements = objDef.elements.map(elm => ({ code: elm.elementCode, type: elm.elementTypeName }));
-                }
-                return { ...objDef, visibleStates };
+                return { ...subSecDef, visibleStates };
             });
             for (const subsectionReceived of subsections) {
                 const subSectionToAdd = new RecordFormSubSection(subsectionReceived, formObject, formConfig);
@@ -1861,14 +1868,23 @@ class RecordFormSection extends FormPiece {
     get title() { return this.sectionTitle; }
     set title(title) { this.sectionTitle = title; }
     getVisibleSubsections(state) {
-        return this.subSections.filter(subSection => {
-            return subSection.visible && subSection.viewOnState(state);
-        });
+        return this.subSections.filter(subSection => subSection.visible);
     }
     getSubsection(subSectionCode) {
         return (this.subSectionsObj && this.subSectionsObj[subSectionCode])
             ? this.subSectionsObj[subSectionCode] : null;
     }
+    activateSubSection(subSectionCode) {
+        if (subSectionCode === this._exclusiveSubSectionsByAttr[ACTIVE$1]) {
+            return;
+        }
+        const subSection = (this.subSectionsObj && this.subSectionsObj[subSectionCode])
+            ? this.subSectionsObj[subSectionCode] : null;
+        if (subSection) {
+            subSection?.activate();
+            this._exclusiveSubSectionsByAttr[ACTIVE$1] = subSectionCode;
+        }
+    }
     getFields() {
         let fieldsArray = [];
         if (this.subSections && this.subSections.length > 0) {
@@ -1923,7 +1939,7 @@ class RecordFormSection extends FormPiece {
         }
         return null;
     }
-    formStateChangeCustom(formChangeSubject) {
+    formStateChangeCustomSubscribe(formChangeSubject) {
         this.subSections?.forEach(subsection => {
             subsection?.subscribeFormStateChange(formChangeSubject);
         });
@@ -1993,7 +2009,7 @@ class FormStructureAndData {
         if (definitionReceived.fields) {
             const formFields = definitionReceived.fields.map(objDef => {
                 let visibleStates = objDef.visibleStates;
-                let enabledStates = objDef.enabledStates || objDef.editableStates;
+                let enabledStates = objDef.enabledStates ?? objDef.editableStates;
                 if (!visibleStates) {
                     visibleStates = (objDef.fieldModes || '').split(',')
                         .map(state => state.trim())
@@ -2272,7 +2288,7 @@ class FormStructureAndData {
     getSections() { return this._sectionArray; }
     getSectionsByAttribute(name, value) { return this._sectionArray.filter(item => item.matchAttribute(name, value)); }
     get sectionTitles() { return this._sectionArray.map(formSection => formSection.sectionTitle); }
-    get visibleSections() { return this._sectionArray.filter(sec => sec.visible); }
+    get visibleSections() { return this._sectionArray.filter(sec => sec.absoluteVisible); }
     getSection(code) { return (code && this._sections?.[code]) ? this._sections[code] : null; }
     showSections(codes) { this.execOnSections(codes, SHOW); }
     hideSections(codes) { this.execOnSections(codes, HIDE); }
@@ -2332,8 +2348,8 @@ class FormStructureAndData {
             const fieldPayload = {
                 fieldCode: fld?.code,
                 fieldValue: fld?.value,
-                editable: !fld?.disabled,
-                visible: fld?.visible,
+                editable: !fld?.absoluteDisabled,
+                visible: fld?.absoluteVisible,
                 required: fld?.required,
                 fieldOptions: '',
             };
@@ -2342,7 +2358,7 @@ class FormStructureAndData {
         formData.tables = this.getTables().map(tbl => {
             const tablePayload = {
                 tableCode: tbl.tableCode,
-                visible: tbl.visible,
+                visible: tbl.absoluteVisible,
                 currentPage: tbl.currentPage,
                 requestedPage: tbl.requestedPage,
                 recordsPerPage: tbl.recordsPerPage,
@@ -3214,7 +3230,7 @@ class BasicFormComponent {
             for (const clientActionMethod of finishActionMethods) {
                 const { callback, properties } = clientActionMethod;
                 const continueOnError = properties?.continueOnError ?? false;
-                if (!serverError || continueOnError) {
+                if (callback && (!serverError || continueOnError)) {
                     clientActionPromises.push(callback(action, actionResult));
                 }
             }