Data Binding(big column, big data)
        - 1,000 views(100 column)    
        - 10,000 views(100 column) 
        - 10,000 views(500 column)         
        - 1,000,000 views(7 column) 
        - Wdt webgrid binding speed is related to count of data rows, count of data column.
        - Wdt webgrid binding speed is related to ablilty of user computor.
        * At this sample, although reaction rate of wdt grid is fast, it takes a long time to make big data of json.
    
        var column = [];
        for (var i = 0; i < 100; i++) {
            var item = {};
            item.id = 'id' + i.toString();
            item.name = 'colName' + i.toString();
            item.type = 'text';
            item.width = '100';
            item.align = 'left';
            column.push(item);
        }
    
        var option = [];
        var count = column.length;
        var data = [];
        for (var rowIndex = 0; rowIndex < 100; rowIndex++) {
            var item = {};
            for (var i = 0; i < count; i++) {
                var col = column[i];
                if (col.type == 'number') item[col.id] = rowIndex;
                else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
            }
            data.push(item);
        }
        wdtGrid.create('grid1', column, option);
        wdtGrid.setData('grid1', data);
        $('#btnSearch1').click(function(e){
            var data = [];
            for (var rowIndex = 0; rowIndex < 100; rowIndex++) {
                var item = {};
                for (var i = 0; i < count; i++) {
                    var col = column[i];
                    if (col.type == 'number') item[col.id] = rowIndex;
                    else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
                }
                data.push(item);
            }
            wdtGrid.setData('grid1', data);
            wdtGrid.selectRange('grid1', 0, 0);
        });
        $('#btnSearch2').click(function(e){
            var data = [];
            for (var rowIndex = 0; rowIndex < 1000; rowIndex++) {
                var item = {};
                for (var i = 0; i < count; i++) {
                    var col = column[i];
                    if (col.type == 'number') item[col.id] = rowIndex;
                    else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
                }
                data.push(item);
            }
            wdtGrid.create('grid1', column, option);
            wdtGrid.setData('grid1', data);
            wdtGrid.selectRange('grid1', 0, 0);
        });
        $('#btnSearch3').click(function(e){
            var data = [];
            for (var rowIndex = 0; rowIndex < 10000; rowIndex++) {
                var item = {};
                for (var i = 0; i < count; i++) {
                    var col = column[i];
                    if (col.type == 'number') item[col.id] = rowIndex;
                    else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
                }
                data.push(item);
            }
            wdtGrid.create('grid1', column, option);
            wdtGrid.setData('grid1', data);
            wdtGrid.selectRange('grid1', 0, 0);
        });
        $('#btnSearch4').click(function(e){
            var column2 =  [
                { id: "text1", name: "text1", type: "text", width: "100", align: 'left' },
                { id: "text2", name: "text2", type: "text", width: "100", align: 'left' },
                { id: "text3", name: "text3", type: "text", width: "100", align: 'left' },
                { id: "text4", name: "text4", type: "text"  , width: "100", align: 'left' },
                { id: "text5", name: "text5", type: "text"  , width: "100", align: 'left' },
                { id: "text6", name: "text6", type: "text"  , width: "100", align: 'left' },
                { id: "text7", name: "text7", type: "text"  , width: "100", align: 'left' }
            ];
            var data = [];
            for (var rowIndex = 0; rowIndex < 1000000; rowIndex++) {
                var item = {};
                for (var i = 0, len = column2.length; i < len; i++) {
                    var col = column2[i];
                    if (col.type == 'number') item[col.id] = rowIndex;
                    else item[col.id] = col.name + '-' + rowIndex.toString() + '-' + i.toString();
                }
                data.push(item);
            }
            wdtGrid.create('grid1', column2, option);
            wdtGrid.setData('grid1', data);
            wdtGrid.selectRange('grid1', 0, 0);
        });
    
email : widthart.mail@gmail.com
Copyrightⓒ2022 by wdtgrid.com. All rights reserved.