How to create and popualte a drop-down list (ComboBox) by developer means?

Question

How can I create a ComboBox and populate it with values by developer means?

Answer

Example of a code:

define("CasePage", ["CasePageResources", "terrasoft"],
    function(resources, Terrasoft) {
    return {
        entitySchemaName: "Case",
        details: /**SCHEMA_DETAILS*/{}/**SCHEMA_DETAILS*/,
        attributes: {
            "myEnum": {
                "dataValueType": Terrasoft.DataValueType.ENUM,
                "type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
                "caption": "myEnum"
            },
            "myList": {
                "dataValueType": Terrasoft.DataValueType.ENUM,
                "type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
                "isCollection": true
            }
        },
        diff: /**SCHEMA_DIFF*/[
            {
                "operation": "insert",
                "name": "myEnum",
                "values": {
                    "caption": "myEnum",
                    "dataValueType": this.Terrasoft.DataValueType.ENUM,
                    "bindTo": "myEnum",
                    "layout": { "colSpan": 24, "rowSpan": 1, "column": 0, "row": 4 },
                    "controlConfig": {
                        "className": "Terrasoft.ComboBoxEdit",
                        "list": {
                            "bindTo": "myList"
                        },
                        "change": {
                            "bindTo": "onMyValueChange"
                        },
                        "prepareList": {
                            "bindTo": "prepareMyList"
                        }
                    }
                },
                "parentName": "SolutionTab_gridLayout",
                "propertyName": "items",
                "index": 1
            }
        ]/**SCHEMA_DIFF*/,
        methods: {
            onPageInitialized: function(callback, scope) {
                if (!this.get("myList")) {
                    this.set("myList", this.Ext.create("Terrasoft.Collection"));
                }
 
                if (callback) {
                    callback.call(scope || this);
                }
            },
            onEntityInitialized: function() {
                this.callParent(arguments);
 
                // and just for debug:
                document.scope = this;
            },
            prepareMyList: function(filter, list) {
                if (list === null) {
                    return;
                }
                list.clear();
                var columns = {};
 
                var value1 = {
                    displayValue: "a123",
                    value: "1"
                };
                var value2 = {
                    displayValue: "b234",
                    value: "2"
                };
                var value3 = {
                    displayValue: "c345",
                    value: "3"
                };
 
                columns[1] = value1;
                columns[2] = value2;
                columns[3] = value3;
 
                list.loadAll(columns);
            },
            onMyValueChange: function(val) {
                if (val && val.displayValue) {
                    console.log("you pick: ", val.displayValue);
                }
            }
        },
        rules: {}
    };
});

 

Like 0

Like

Share

0 comments
Show all comments