Question

Problem with selected rows in detail

When I click the detail row , it disappear , and a white background appear , I wonder what is the problem.

Note : I'm  working with a custom detail with list

 

Like

2 comments

this is my code

 

define("StFriendAndFamilyNumbersDetail", ["StFriendAndFamilyDetailResources", "ConfigurationGrid", "ConfigurationGridGenerator",
    "ConfigurationGridUtilities", "StServiceViewModel", "css!StServiceDetailCSS"], function (resources) {
    var detailData =[];
    var isAddMode =false;
    var isFirstTime = true;
return {
    entitySchemaName: "StFriendAndFamilyDetail",
    mixins: {
        ConfigurationGridUtilities: "Terrasoft.ConfigurationGridUtilities"
    },
    attributes: {
        "StNameFilter": {
            "dataValueType": Terrasoft.DataValueType.TEXT
        },
        "IsEditable": {
            "dataValueType": Terrasoft.DataValueType.BOOLEAN,
            "type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
            "value": false
        },
        "PageNumber": {
            "dataValueType": Terrasoft.DataValueType.INTERGER,
            "type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
            "value": 0
        },
        "NumberOfRecords": {
            "dataValueType": Terrasoft.DataValueType.INTERGER,
            "type": Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN,
            "value": 15
        }
    },
    methods: {
        sortColumn: this.Terrasoft.emptyFn,
        loadGridData: this.Terrasoft.emptyFn,
        loadFilter: function () {
            this.set("PageNumber", 0);
            var gridData = this.getGridData();
            if (gridData) {
                gridData.clear();
                this.set("IsDetailCollapsed", false);
                this.loadSearchItems(
                    this.get("StNameFilter"),
                    this.get("PageNumber"),
                    this.get("NumberOfRecords"),
                    gridData
                );
            }
        },
        loadMore: function () {
            var pageNumber = this.get("PageNumber");
            this.set("PageNumber", ++pageNumber);
            var gridData = this.getGridData();
            if (gridData) {
                this.loadSearchItems(
                    this.get("StNameFilter"),
                    this.get("PageNumber"),
                    this.get("NumberOfRecords"),
                    gridData
                );
            }
        },
        generateActiveRowControlsConfig: function (id, columnsConfig, rowConfig) {
            debugger;
            this.columnsConfig = columnsConfig;
            var gridLayoutItems = [];
            var currentColumnIndex = 0;
            this.Terrasoft.each(columnsConfig, function (columnConfig) {
                var columnName = columnConfig.key[0].name.bindTo;
                var column = this.getColumnByColumnName(columnName);
                var cellConfig = this.getCellControlsConfig(column);
                cellConfig = this.Ext.apply({
                    layout: {
                        colSpan: columnConfig.cols,
                        column: currentColumnIndex,
                        row: 0,
                        rowSpan: 1
                    }
                }, cellConfig);
            /*    if (cellConfig.name === "StServiceParams") {
                    this.set("ComboBoxCollection", new this.Terrasoft.Collection());
                    cellConfig.contentType = Terrasoft.ContentType.ENUM;
                    cellConfig = this.Ext.apply({
                        controlConfig: {
                            list: {
                                bindTo: "ComboBoxCollection"
                            },
                            prepareList: {
                                bindTo: "getComboBoxItems"
                            },
                            change: {
                                bindTo: "ontServiceParamsChange"
                            }
                        }
                    }, cellConfig);
                    cellConfig.enabled = true;
                }
                else {
                    cellConfig.enabled = false;
                }*/
                gridLayoutItems.push(cellConfig);
                currentColumnIndex += columnConfig.cols;
            }, this);
            var gridData = this.getGridData();
            var activeRow = gridData.get(id);
            var options = activeRow.values;
            activeRow.setOptions(options);
            var viewGenerator = this.Ext.create("Terrasoft.ViewGenerator");
            viewGenerator.viewModelClass = { prototype: this };
            var gridLayoutConfig = viewGenerator.generateGridLayout({
                name: this.name,
                items: gridLayoutItems
            });
            console.log(gridLayoutConfig);
            rowConfig.push(gridLayoutConfig);
        },
    
    /*    onSubmitDetail: function () {
            var selectedRows = this.get("SelectedRows");
            if (selectedRows && selectedRows.length > 0) {
                for (var i = 0; i < selectedRows.length; i++) {
                    var selectedItem = this.getGridData().collection.getByKey(selectedRows[i]);
                }
                debugger;
                // TODO selected items processing logic
            }
            else {
                this.showInformationDialog("There isn't any selected item");
            }
        },*/
        init: function (callback, scope) {
            this.set("PageNumber", 0);
            this.callParent([
                function () {
                    var gridData = this.getGridData();
                    if (gridData) {
                        gridData.clear();
                        this.set("IsDetailCollapsed", false);
                        this.loadSearchItems( null, this.get("PageNumber"),
                        this.get("NumberOfRecords"), gridData);
                    }
                    callback.call(scope);
                }, this
            ]);
        
        
            this.sandbox.subscribe("SendDetailData", function (arg) {
                    debugger;
                     detailData = arg.array;

                    this.UpdateRatePlanServices();

                }, this, ["SendDetailDataKey"]);
                
                
            this.sandbox.subscribe("GetDetailData", function (arg) {
                   debugger;
                   var gridData = this.getGridData();
                   var array=[];
        
                if(isFirstTime){
                    
                    isFirstTime=false;
                    
                    for (var i = 0; i < gridData.collection.items.length; i++) {
                           
                           var item = gridData.collection.items[i];
                           var obj={};
                        obj.Id = item.values.StId;
                        obj.PhoneNumber = item.values.StPhoneNumber;
                        obj.ContractId = item.values.StContractId;
                        
                        array.push(obj);
                           
                       }
                       
                    return array;
                    
                }else{
                    
                    return detailData;
                    
                }
                   
                    
           }, this, ["GetDetailDataKey"]);
        
        
        },
        onDetailCollapsedChanged: function () {
            this.callParent(arguments);
            if (!this.get("IsDetailCollapsed")) {
                this.set("PageNumber", 0);
                var gridData = this.getGridData();
                if (gridData) {
                    gridData.clear();
                    this.loadSearchItems( null, this.get("PageNumber"),
                    this.get("NumberOfRecords"), gridData);
                }
            }
        },
        loadSearchItems: function (nameFltr, pageNb, nbOfRecords, gridData) {
    
            debugger;

            var contractId = this.sandbox.publish("GetContractIDMessage", null, ["GetContractIDMessageKey"]);
            
            this.set("MaskId", Terrasoft.Mask.show({ timeout: 0 }));
            this.set("IsGridEmpty", true);
            this.set("IsGridLoading", true);
            this.set("IsGridDataLoaded", false);
            
            if(detailData == null || detailData == "" || detailData == []){
                
                var serviceConfig = {
                    serviceName: "StContractManagerService",
                    methodName: "GetFriendAndFamilyNumbers",
                    timeout: 120000,
                    data: { 
                        contractId: contractId
                    }
                };
                isAddMode = false;
            }else{
                
                var serviceConfig = {
                    serviceName: "StContractManagerService",
                    methodName: "ConstructFriendAndFamilyDetail",
                    timeout: 120000,
                    data: { 
                        array: JSON.stringify(detailData)
                    }
                };
                    isAddMode = true;
            }
            
            this.callService(serviceConfig, function (responseJson) {
                this.set("IsGridLoading", false);
                this.set("IsGridDataLoaded", true);
                if (!this.Ext.isEmpty(responseJson)) {
                    
                        if(!isAddMode){ 
                            var response = this.Ext.decode(responseJson.GetFriendAndFamilyNumbersResult);
                        }else{
                            var response = this.Ext.decode(responseJson.ConstructFriendAndFamilyDetailResult);
                        }
                        
                    if (response.success) {
                            console.log(response);
                        if (response.rowsAffected > 0) {
                            this.set("IsGridEmpty", false);
                            this.set("CanLoadMoreData", response.canShowMore);
                            var esq = this.Ext.create("Terrasoft.EntitySchemaQuery", {
                                rootSchemaName: "StFriendAndFamilyDetail",
                                rowViewModelClassName: "Terrasoft.StServiceViewModel"
                            });
                            esq.parseResponse(response, function (result) {
                                if (result.success) {
                                    console.log(result);
                                    var resultCollection = result.collection;
                                    resultCollection.each(function (item) {
                                    item.init(this);
                                    }, this);
                                    gridData.loadAll(result.collection);
                                    this.prepareResponseCollection(resultCollection);
                                    Terrasoft.Mask.hide(this.get("MaskId"));
                                    
                                    
                                }
                                else {
                                    this.showInformationDialog(result.errorInfo);
                                    Terrasoft.Mask.hide(this.get("MaskId"));
                                }
                            }, this);
                        }
                        else {
                            this.set("CanLoadMoreData", false);
                            Terrasoft.Mask.hide(this.get("MaskId"));
                        }
                    }
                    else {
                        this.set("CanLoadMoreData", false);
                        this.showInformationDialog(response.errorInfo.message);
                        Terrasoft.Mask.hide(this.get("MaskId"));
                    }
                }
            }, this);
        },
    
        UpdateRatePlanServices: function(){
            var gridData = this.getGridData();
                    if (gridData) {
                        gridData.clear();
                        this.set("IsDetailCollapsed", false);
                        this.loadSearchItems( null, this.get("PageNumber"),
                        this.get("NumberOfRecords"), gridData);
                    }
            },
    
        
        onActiveRowAction: function (buttonTag,primaryColumnValue) {
                debugger;
                switch (buttonTag) {
                case "someButton":
                //this.onSomeButtonClicked(primaryColumnValue);
                break;
                default:
                break;
                }
        },
                
    },
    messages: {
            "SendDetailData": {
                mode: Terrasoft.MessageMode.PTP,
                direction: Terrasoft.MessageDirectionType.SUBSCRIBE
            },
             "GetDetailData":
             {
                mode: Terrasoft.MessageMode.PTP,
                direction: Terrasoft.MessageDirectionType.SUBSCRIBE
            },
            "GetContractIDMessage": {
                mode: Terrasoft.MessageMode.PTP,
                direction: Terrasoft.MessageDirectionType.PUBLISH
            },

        },
    diff: /**SCHEMA_DIFF*/[
        {
            "operation": "merge",
            "name": "DataGrid",
            "parentName": "Detail",
            "values": {
                "className": "Terrasoft.ConfigurationGrid",
            //    "generator": "ConfigurationGridGenerator.generatePartial",
                "generateControlsConfig": { "bindTo": "generateActiveRowControlsConfig" },
                /*"changeRow": { "bindTo": "changeRow" },*/
                "multiSelect": true
            },
            "index": 0
        },

    {
                "operation": "merge",
                "name": "DataGrid",
                "values": {
                    "activeRowAction": {"bindTo": "onActiveRowAction"},
                    "activeRowActions": []
                    
                }
            },
            {
                "operation": "insert",
                "name": "DataGridActiveRowSomeButton",
                "parentName": "DataGrid",
                "propertyName": "activeRowActions",
                "values": {
                    "className": "Terrasoft.Button",
                    "style": Terrasoft.controls.ButtonEnums.style.GREEN,
                    "caption": "Details",
                    "tag": "someButton"
                }
            },
    
            
    
    ]
    /**SCHEMA_DIFF*/
};
});
 

Hello Mohamad!

To resolve this problem you should debug js client code. Here you can read additional information about debugging client code:
https://academy.bpmonline.com/documents/technic-sdk/7-13/client-code-de… 

If I got this right, method "generateActiveRowControlsConfig" triggers when user clicks on row, so you should pay an extra attention to it.

Best regards,
Alex

Log in or register to comment