NeXTs / Clusterize.js

Tiny vanilla JS plugin to display large data sets easily
https://clusterize.js.org
MIT License
7.22k stars 412 forks source link

only first 200 items shown using Clusterize.append() #139

Closed allanlaal closed 6 years ago

allanlaal commented 6 years ago

I'm having the same issue as #111, only with ul's and I've doublechecked everything 4 times and tested with every Clusterize version and still it only displays 200 (rows_in_block * blocks_in_cluster) rows and nothing more. although getRowsAmount() has the correct number of rows (~6700)

    <div id="dashboard_list_container" class="clusterize-scroll">
        <ul 
            id="dashboard_list"
            category="starred" 
            class="category_default todo_item_list clusterize-content"
            newest_id=""
        >
        </ul>
    </div>  

and the js side:

todo_dashboard_list_clusterize_instance = new Clusterize({
    rows:               [], // filled by load_todo_dashboard_list_get via Clusterize.append()
    scrollId:           'dashboard_list_container',
    contentId:          'dashboard_list',
    tag:                'li',
    rows_in_block:      50, // max amount of Todo rows on a normal screen
    blocks_in_cluster:  4,
    show_no_data_row:   true,
    no_data_text:       dashboard_list_load_pageholder,
    no_data_class:      'dashboard_list_loading_indicator',
    keep_parity:        false,
    callbacks: {
        clusterChanged: function() {
            calc_todo_totals();
        }
    }
});

rows are appended using:

$.post(...)
.done(function(result) {

        var append_arr = compose_dashboard_list_append_array(result); 
        // converts array of todos into an array of todo row html snippets:
            [
                "<li id="todo_row_1">...</li>",
                "<li id="todo_row_2">...</li>",
                "<li id="todo_row_3">...</li>",
                "<li id="todo_row_4">...</li>",
                ...
                "<li id="todo_row_N">...</li>"
            ]
        todo_dashboard_list_clusterize_instance.append(append_arr);

all of that works, every append triggers a clusterChanged

the todo row itself is ~1000 lines of html with various inputs and lots and lots of children (none of them are ul or li though)

NeXTs commented 6 years ago

Hello Can I see it live somewhere?

111 missed required max-height: 200px; property which comes with .clusterize-scroll class name.

allanlaal commented 6 years ago

my bad, I did not include the clusterize.css file in my theme