Question

我希望我的主题在本论坛中正确无误。我有一个HTML表，最多包含3000个元素和5列。

对于这个表和其他我编写了一个函数，用于根据列的内容过滤表。

更确切地说，我为每列添加了一个输入。然后，通过输入中的过滤器值实时搜索表格的内容（在按下一个键之后）。

目前，我正在使用最多包含2000个元素的表来测试该函数。速度还可以，但可能更好。我担心3000个或更多元素的桌子可能是一个艰难的挑战。

我希望得到一些想法/意见/建议，我可以做些什么来改进我的算法。

//
// Search Table by filter and index
//
// e        -> event
// inputs   -> search-inputs
// idx      -> column-index-array
//
function search_table(e, inputs, idx){
    //get values from search-textbox's
    var values = new Array();
    Array.each(inputs, function(v){ values.push(v.get('value').toString().toUpperCase()); });

    //get table-rows
    var haystack = inputs[0].getParent('table').getChildren('tbody').getChildren('tr')[0];

    var stack = new Array(); //row-stack for recoloring rows
    var hide = 'row_hide';

    //each row
    Array.each(haystack, function(row){
        var childs = row.getChildren('td'); //columns
        var texts = new Array();            //content of cols

        //check idx
        if(idx == null){
            //set index-array from 0 to length
            idx = new Array();
            Array.each(childs, function(v, i){ idx.push(i); });
        }

        //get content from columns based on allowed index
        Array.each(childs, function(child, i){ 
            if(idx.indexOf(i) != -1)
                texts.push(child.get('html').toString().toUpperCase()); 
        });

        //remove css-class for colored row
        row.removeClass('row_0');
        row.removeClass('row_1');

        //check if content matches search-input-values for each column
        var flag = true;
        Array.each(texts, function(text, i){ flag &= text.contains(values[i]);});

        if(flag){
            //add to recoloring stack and 'unhide' row
            stack.push(row);
            row.removeClass(hide);
        } else {
            //hide if not matching
            row.addClass(hide);
        }           
    });

    //recolor matching rows
    Array.each(stack, function(row, i){
        row.addClass('row_' + (i % 2));
    });
}

亲切的问候马里奥

引导表搜索功能

0 个答案: