Editable list on section page

Dear Carlos, 

Please see the example below, hope you find it helpful:

define("ActivitySectionV2", ["ConfigurationGrid", "ConfigurationGridGenerator", "ConfigurationGridUtilities"],
    function() {
        return {
            entitySchemaName: "Activity",
            messages: {},
            mixins: {
                ConfigurationGridUtilites: "Terrasoft.ConfigurationGridUtilities"
            },
            attributes: {
                IsEditable: {
                    dataValueType: Terrasoft.DataValueType.BOOLEAN,
                    type: Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
                    value: true
                }
            },
            methods: {
                edit: function() {
                    var procElId = this.getActiveRow().get("ProcessElementId");
                    var recordId = this.get("ActiveRow");
                    if (procElId && !this.Terrasoft.isEmptyGUID(procElId)) {
                        this.sandbox.publish("ProcessExecDataChanged", {
                            procElUId: procElId,
                            recordId: recordId,
                            scope: this,
                            parentMethodArguments: null,
                            parentMethod: function() {
                                return false;
                            }
                        });
                        return true;
                    }
                    this.editRecord(recordId);
                },
                editRecord: function(primaryColumnValue) {
                    this.Terrasoft.chain(
                        function(next) {
                            var activeRow = this.findActiveRow();
                            this.saveRowChanges(activeRow, next);
                        },
                        function() {
                            var activeRow = this.getActiveRow();
                            var typeColumnValue = this.getTypeColumnValue(activeRow);
                            var schemaName = this.getEditPageSchemaName(typeColumnValue);
                            this.openCardInChain({
                                id: primaryColumnValue,
                                schemaName: schemaName,
                                operation: Terrasoft.ConfigurationEnums.CardOperation.EDIT,
                                moduleId: this.getChainCardModuleSandboxId(typeColumnValue)
                            });
                        }, this);
                },
                addRecord: function(typeColumnValue) {
                    if (!typeColumnValue) {
                        if (this.get("EditPages").getCount() > 1) {
                            return false;
                        }
                        var tag = this.get("AddRecordButtonTag");
                        typeColumnValue = tag || this.Terrasoft.GUID_EMPTY;
                    }
                    this.addRow(typeColumnValue);
                },
                copyRecord: function(primaryColumnValue) {
                    this.copyRow(primaryColumnValue);
                },
                getGridRowViewModelConfig: function() {
                    var gridRowViewModelConfig =
                        this.mixins.GridUtilities.getGridRowViewModelConfig.apply(this, arguments);
                    Ext.apply(gridRowViewModelConfig, {entitySchema: this.entitySchema});
                    var editPages = this.get("EditPages");
                    this.Ext.apply(gridRowViewModelConfig.values, {HasEditPages: editPages && !editPages.isEmpty()});
                    return gridRowViewModelConfig;
                },
                getGridRowViewModelClassName: function() {
                    return this.mixins.GridUtilities.getGridRowViewModelClassName.apply(this, arguments);
                },
                onRender: function() {
                    this.callParent(arguments);
                    if (!this.get("Restored")) {
                        this.reloadGridColumnsConfig(true);
                    }
                },
                getDefaultGridColumns: function() {
                    var systemColumns = this.systemColumns;
                    var allowedDataValueTypes = this.get("AllowedDataValueTypes");
                    var entitySchema = this.entitySchema;
                    var entitySchemaColumns = [];
                    Terrasoft.each(entitySchema.columns, function(column, columnName) {
                        if (Ext.Array.contains(systemColumns, columnName) ||
                            !Ext.Array.contains(allowedDataValueTypes, column.dataValueType)) {
                            return;
                        }
                        entitySchemaColumns.push(column);
                    }, this);
                    var primaryDisplayColumnName = entitySchema.primaryDisplayColumnName;
                    entitySchemaColumns.sort(function(a, b) {
                        if (a.name === primaryDisplayColumnName) {
                            return -1;
                        }
                        if (b.name === primaryDisplayColumnName) {
                            return 1;
                        }
                        return 0;
                    }, this);
                    return (entitySchemaColumns.length > 4) ? entitySchemaColumns.slice(0, 4) : entitySchemaColumns;
                },
                onActiveRowAction: function() {
                    this.mixins.ConfigurationGridUtilities.onActiveRowAction.apply(this, arguments);
                    this.callParent(arguments);
                },
                onActiveRowAction: function(buttonTag, primaryColumnValue) {
                    switch (buttonTag) {
                        case "card":
                            this.edit();
                            break;
                        case "copy":
                            this.copyRecord(primaryColumnValue);
                            break;
                        case "remove":
                            this.deleteRecords();
                            break;
                        case "cancel":
                            this.discardChanges(primaryColumnValue);
                            break;
                        case "save":
                            this.onActiveRowSave(primaryColumnValue);
                            break;
                    }
                }
            },
            diff: /**SCHEMA_DIFF*/[
                {
                    "operation": "merge",
                    "name": "DataGrid",
                    "values": {
                        "className": "Terrasoft.ConfigurationGrid",
                        "generator": "ConfigurationGridGenerator.generatePartial",
                        "generateControlsConfig": {"bindTo": "generatActiveRowControlsConfig"},
                        "changeRow": {"bindTo": "changeRow"},
                        "unSelectRow": {"bindTo": "unSelectRow"},
                        "onGridClick": {"bindTo": "onGridClick"},
                        "initActiveRowKeyMap": {"bindTo": "initActiveRowKeyMap"},
                        "activeRowAction": {"bindTo": "onActiveRowAction"},
                        "multiSelect": {"bindTo": "MultiSelect"}
                    }
                },
                {
                    "operation": "insert",
                    "name": "activeRowActionSave",
                    "parentName": "DataGrid",
                    "propertyName": "activeRowActions",
                    "values": {
                        "className": "Terrasoft.Button",
                        "style": Terrasoft.controls.ButtonEnums.style.TRANSPARENT,
                        "tag": "save",
                        "markerValue": "save",
                        "imageConfig": {"bindTo": "Resources.Images.SaveIcon"}
                    }
                },/*
                {
                    "operation": "insert",
                    "name": "activeRowActionCopy",
                    "parentName": "DataGrid",
                    "propertyName": "activeRowActions",
                    "values": {
                        "className": "Terrasoft.Button",
                        "style": Terrasoft.controls.ButtonEnums.style.TRANSPARENT,
                        "tag": "copy",
                        "markerValue": "copy",
                        "imageConfig": {"bindTo": "Resources.Images.CopyIcon"}
                    }
                },*/
                {
                    "operation": "insert",
                    "name": "activeRowActionCard",
                    "parentName": "DataGrid",
                    "propertyName": "activeRowActions",
                    "values": {
                        "className": "Terrasoft.Button",
                        "style": Terrasoft.controls.ButtonEnums.style.TRANSPARENT,
                        "tag": "card",
                        "markerValue": "card",
                        "visible": {"bindTo": "HasEditPages"},
                        "imageConfig": {"bindTo": "Resources.Images.CardIcon"}
                    }
                },
                {
                    "operation": "insert",
                    "name": "activeRowActionCancel",
                    "parentName": "DataGrid",
                    "propertyName": "activeRowActions",
                    "values": {
                        "className": "Terrasoft.Button",
                        "style": Terrasoft.controls.ButtonEnums.style.TRANSPARENT,
                        "tag": "cancel",
                        "markerValue": "cancel",
                        "imageConfig": {"bindTo": "Resources.Images.CancelIcon"}
                    }
                },
                {
                    "operation": "insert",
                    "name": "activeRowActionRemove",
                    "parentName": "DataGrid",
                    "propertyName": "activeRowActions",
                    "values": {
                        "className": "Terrasoft.Button",
                        "style": Terrasoft.controls.ButtonEnums.style.TRANSPARENT,
                        "tag": "remove",
                        "markerValue": "remove",
                        "imageConfig": {"bindTo": "Resources.Images.RemoveIcon"}
                    }
                },
                {
                    "operation": "remove",
                    "name": "DataGridActiveRowOpenAction"
                },
                {
                    "operation": "remove",
                    "name": "DataGridActiveRowCopyAction"
                },
                {
                    "operation": "remove",
                    "name": "DataGridActiveRowDeleteAction"
                },
                {
                    "operation": "remove",
                    "name": "ProcessEntryPointGridRowButton"
                }
            ]/**SCHEMA_DIFF*/
        };
    }
);

Regards,

Anastasia

Anastasia Botezat,

Thank you

Anastasia Botezat,

Can we display a list in modal?

Best Regards,

Solem A,

Solem Khan Abdusalam,

Hard to say. There should be "ConfigurationGrid", "ConfigurationGridGenerator", "ConfigurationGridUtilities" modules added as dependencies to the module of your modal window and then the grid should be added to the modal box diff. But this approach should be tested.

Best regards,

Oscar 

Hi,

I've tested the code and it works ok, but I've noticed that if you open a page and after when you want to close it, you need to click twice on close button. Did someone faced similar behavior, or knows the reason why it happens?

Best regards,

Jelena