OnRowCreated not firing until row clicked

1 posts, 0 answers
  1. Tony
    Tony avatar
    1 posts
    Member since:
    Jul 2017

    Posted 15 Nov 2017 Link to this post

    So i am using a RadGrid in a custom control. In the java script i am binding the grids events to events declared in my custom control. The issue is the rowCreated function is not firing until i actually click a row. Since its within a prototype i have to create it as a delegate to ensure i can still access other variables in the same scope.

    grid.add_rowCreated(Function.createDelegate(this, this.rowCreated));

     

    But this causes the rowCreated event to not fire until i interact with the grid by selecting a row. Could someone give me some guidance on this please, it may be something obvious as i am fairly new to webforms controls. I have added the full code below, but have cut it down to be relevant.

    Type.registerNamespace("WebApp.Portal.Controls");
     
    // Define the control properties.
    WebApp.Portal.Controls.DataViewContainer = function (element) {
        WebApp.Portal.Controls.DataViewContainer.initializeBase(this, [element]);
        this._clientId = null;
        this._radGridId = null;
        this._keyColumnName = null;
        this._idsOfSelectedRows = [];
    };
     
    // Define the prototype
    WebApp.Portal.Controls.DataViewContainer.prototype = {
     
        initialize: function (sender, eventArgs) {
            WebApp.Portal.Controls.DataViewContainer.callBaseMethod(this, 'initialize');
     
            // Will be called on ajax or full postback
            window.Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(Function.createDelegate(this, this.onLoad));
            // If this is being executed by ajax
            if (eventArgs) {
                // And this is only a partial load
                if (eventArgs.get_isPartialLoad()) {
                    // Don't perform any further processing
                    return;
                }
            }
            // only hit on full postback.
            this.bindEvents();
        },
     
        dispose: function() {
            WebApp.Portal.Controls.DataViewContainer.callBaseMethod(this, 'dispose');
        },
         
        idsOfSelectedRows: [],
     
        //
        // Methods.
        //
        onLoad: function () {
        },
         
        bindEvents: function () {
            var grid = window.$find(this.get_radGridId());
            if (grid != undefined) {
                grid.add_rowSelected(Function.createDelegate(this, this.rowSelected));
                grid.add_rowDeselected(Function.createDelegate(this, this.rowDeselected));
                grid.add_rowCreated(Function.createDelegate(this, this.rowCreated));
                grid.add_gridCreated(Function.createDelegate(this, this.gridCreated));
            }
        },
     
        rowSelected : function(sender, args) {
            var entityId = args.getDataKeyValue(this._keyColumnName);
            this.updateIdsOfSelectedRows(entityId, true);
            console.log(JSON.stringify(this.idsOfSelectedRows));
        },
         
        rowDeselected : function (sender, args) {
            var entityId = args.getDataKeyValue(this._keyColumnName);
            this.updateIdsOfSelectedRows(entityId, false);
            console.log(JSON.stringify(this.idsOfSelectedRows));
        },
         
        rowCreated : function (sender, args) {
            var entityId = args.getDataKeyValue(this._keyColumnName);
            console.log("Row Created: " + entityId);
            if ($.inArray(entityId, this.idsOfSelectedRows) >= 0) {
                args.get_gridDataItem().set_selected(true);
            }
        },
         
        gridCreated : function (sender, eventArgs) {
            var masterTable = sender.get_masterTableView();
            var selectColumn = masterTable.getColumnByUniqueName("clmSelect");
            var headerCheckBox = $(selectColumn.get_element()).find("[type=checkbox]")[0];
            if (headerCheckBox) {
                headerCheckBox.checked = masterTable.get_selectedItems().length == masterTable.get_dataItems().length;
            }
        },
         
        updateIdsOfSelectedRows : function(id, isSelected) {
            var index = $.inArray(id, this.idsOfSelectedRows);
            if (!isSelected && index >= 0) {
                this.idsOfSelectedRows.splice(index, 1); // remove id from the list
            } else if (index < 0) {
                this.idsOfSelectedRows.push(id);
            }
        },
     
        //
        // Properties.
        //
        get_radGridId: function() {
            return this._radGridId;
        },
         
        set_radGridId: function(value) {
            if (this._radGridId !== value) {
                this._radGridId = value;
                this.raisePropertyChanged('_radGridId');
            }
        },
     
        get_clientId: function () {
            return this._clientId;
        },
     
        set_clientId: function (value) {
            if (this._clientId !== value) {
                this._clientId = value;
                this.raisePropertyChanged('clientId');
            }
        },
         
        get_keyColumnName: function () {
            return this._keyColumnName;
        },
     
        set_keyColumnName: function (value) {
            if (this._keyColumnName !== value) {
                this._keyColumnName = value;
                this.raisePropertyChanged('keyColumnName');
            }
        },
    };
     
    WebApp.Portal.Controls.DataViewContainer.registerClass('WebApp.Portal.Controls.DataViewContainer', Sys.UI.Control);

     

     

Back to Top