Почему Slickgrid Ajax / Infinite Scroll создает прерывистые пустые строки?

Question

При прокрутке удаленного источника данных SlickGrid работает правильно, но часто добавляет ряд пустых строк.

Например:

Хорошо Хорошо Хорошо Пусто Пусто Пусто Хорошо Хорошо Хорошо Хорошо Хорошо

В процессе загрузки данных создается впечатление, что затем создаются пустые строки, а затемиспользует последующие строки, а не пустые, которые он создал, для рендеринга заполненных строк.

Я посмотрел повсюду и потерпел неудачу.Кто-нибудь может придумать что-то, что могло бы вызвать такое поведение?

Заранее спасибо.

Answer 1

Существует ошибка в методе sureData (from, to) в примере slickgrid RemoteModel, но я точно не помню, что именно. Я исправил это и еще немного, чтобы более эффективно использовать внутреннюю базу данных. Вот код:

    /** Ensures data range is loaded, loading if necessary. */
    function ensureData(from, to) {
        // Reduce range to only unloaded data by eliminating already loaded data at the extremes
        // or data which is already being loaded by a pending request
        if (from < 0) {from = 0;}
        while (data[from] !== undefined && from < to) {from++;}
        while (data[to] !== undefined && from < to) {to--;}

        // no need to load anything
        if (data[from] !== undefined) {
            return;
        }

        // A request for data must be made: increase range if below optimal request size
        // to decrease number of requests to the database
        var size = to - from + 1;
        if (size < optimalRequestRangeSize) {
            // expand range in both directions to make it equal to the optimal size
            var expansion = Math.round((optimalRequestRangeSize - size) / 2);
            from -= expansion;
            to += expansion;

            // if range expansion results in 'from' being less than 0,
            // make it to 0 and transfer its value to 'to' to keep the range size
            if (from < 0) {
                to -= from;
                from = 0;
            }

            // Slide range up or down if data is already loaded or being loaded at the top or bottom...
            if (data[from] !== undefined) {
                while (data[from] !== undefined) {
                    from++; 
                    to++;
                }
            }
            else if (data[to] !== undefined) {
                while (data[to] !== undefined && from > 0) {
                    from--; 
                    to--;
                }
            }
        }

        // After adding look-ahead and look-behind, reduce range again to only unloaded 
        // data by eliminating already loaded data at the extremes
        while (data[from] !== undefined && from < to) {from++;}
        while (data[to] !== undefined && from < to) {to--;}

        // clear any pending request
        if ( request !== null)
            clearTimeout( request);

        // launch request to server with a delay of 100ms to cater with quick scrolling down
        request = setTimeout(function() {
            requests++;

            // set records in range to null; null indicates a 'requested but not available yet'
            for (var i = from; i <= to; i++) {
                if (!data[i]) {
                    data[i] = null; 
                }
            }

            // notify grid (to show loading message) and load through ajax
            onDataLoading.notify({from: from, to: to});
            $.ajax({
                url: url,
                global: false,
                cache: true,
                type: "GET",
                data: {
                  from: from,
                  to: to,
                  sortColumn: sortColumn,
                  sortDirection: sortDirection
                },
                dataType: "xml",
                success: function(response, textStatus, jqXHR) {
                    if (requests > 0) requests--;
                    onSuccess(response, textStatus, jqXHR)
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    if (requests > 0) requests--;
                    if (textStatus !== "abort") {
                        onDataLoadingError.notify({
                            from: from, to: to, pendingRequests:requests, 
                            textStatus: textStatus, errorThrown: errorThrown
                        });
                    }
                }
           });
        }, 100);
    }

Надеюсь, это поможет.