Question

I use qooxdoo 3.5, but same situation I got on 3.0.1.

Remote table is build according to the example from docs.

In represetatnion class I don't use antyhing fancy. The issue is that when data rows are exceeding the BlockSize, empty rows are generated. After using reloadData everything is filled properly. The problem is that using reloadData is not efficient. Did you meet similar problem with prefetching and cache data?

Link to screenshots

Remote table model:

qx.Class.define("atms.RemoteTableCases",
{
extend : qx.ui.table.model.Remote,

include: [qx.locale.MTranslation],

properties :
{
    test: {
        init:  '',
        nullable: true,
        event: "changeTest"
    },

    param :
    {
        init  : "?query=",
        check : "String"
    }
},

construct : function()
{
    this.base(arguments);
    var colnames = {            
        "status"       : this.tr("Status"),
        "user"         : this.tr("Assigned to"),
        "name"         : this.tr("Case Name"),
        "expected_time": this.tr("Expected time"),
        "result_time"  : this.tr("Result time"),
        "weight"       : this.tr("Impact factor")
    };
    var col_keys = new Array();
    var col_values = new Array();

    for (var key in colnames) {
        col_keys.push(key);
        col_values.push(colnames[key]);
    }
    this.base(arguments);
    this.setColumns(col_values, col_keys);
    this.__colKeys = col_keys;

    this.setColumnSortable(0, true);

    this.setBlockSize(4);
    this.__setupResources();
},

members :
{
    __colKeys: null,

    __setupResources: function() {
        this.__rows = new qx.io.rest.Resource({
            "get"      :   { method: "GET",    url: SERVER + "get_cases_count.json/{id}" },
            "getCases" :   { method: "GET",    url: SERVER + "get_cases.json/{test}{param}" }
        });
        this.__rows.addListener('getSuccess', function(e) {
            this._onRowCountCompleted(e.getData().content);
        }, this);
        this.__rows.addListener('getCasesSuccess', function(e) {
            this._onLoadRowDataCompleted(e.getData().content);
        }, this);
    },

    _loadRowCount : function() { this.__rows.get({id:this.getTest()}); },

    _onRowCountCompleted : function(result)
    {
        if (result != null) {
            this._onRowCountLoaded(result);
        }
    },

    _loadRowData : function(firstRow, lastRow) {
        var parameters = "?from=" + firstRow + "&to=" + lastRow;

        var sortIndex = this.getSortColumnIndex() == -1 ?
            'null' : this.__colKeys[this.getSortColumnIndex()];
        var sortOrder =  this.isSortAscending() ? "asc" : "desc";
        parameters += "&sortOrder=" + sortOrder + "&sortIndex=" + sortIndex;

        this.__rows.getCases({
            test:  this.getTest(),
            param: parameters
        });
    },

    _onLoadRowDataCompleted : function(result)
    {
        if (result != null) {
            this._onRowDataLoaded(result);
        }
    }
}
});
Was it helpful?

Solution

Please make sure, the data loaded in the method call _onRowDataLoaded corresponds exactly the data range requested by _loadRowData : function(firstRow, lastRow).

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top