کامپوننت صفحه گسترده جاوا اسکریپت رایگان برای رندر و پردازش سریع

شروع کار با SlickGrid

روش توصیه شده برای نصب SlickGrid، استفاده از npm است، برای نصب SlickGrid، فقط تگ اسکریپت زیر را در مرورگر اضافه کنید.

npm install slickgrid 

می‌توانید کتابخانه مشترک کامپایل‌شده را از مخزن GitHub دانلود و نصب کنید.

چگونه با استفاده از JavaScript API سلول ها را ادغام کنیم؟

ادغام سلول ها در یک صفحه گسترده یک ویژگی بسیار مفید است که اغلب برای قرار دادن متن در چندین ردیف یا ستون استفاده می شود و می تواند برای ترکیب رشته های داده دو یا چند سلول مفید باشد. هدف اصلی آن این است که داده ها را برای کاربر نهایی قابل ارائه و خوانا کند. جزء Open Source SlickGrid JavaScript به توسعه دهندگان نرم افزار اجازه می دهد تا چندین سلول، ردیف یا ستون را در برنامه های جاوا اسکریپت خود ترکیب کنند.

function VerCellMergedFormatter(row, cell, value, columnDef, dataContext) {
    var options = window._renderOptions;
    if (options.lastRendering != 1) {
        return;
    }
    var items = window.getRenderDataItmes();
    var fieldName = columnDef.field;
    var rowsLength = items.length;
    var currentItem = items[row];
    var nextRowIndex = row + 1;
    if (nextRowIndex < rowsLength){
        var nextValue = items[nextRowIndex][fieldName];
        if (value == nextValue) {
            if (!options.changedCells[row]) {
                options.changedCells[row] = {};
            }
            options.changedCells[row][fieldName] = "noneline-bottom";
            options.isNextMerged = 1;
            return value;
        }
        else {
            if (options.isNextMerged == 1) {
                options.isNextMerged = 0;
                return;
            }
        }
    }
    return value;
}

ستون‌ها، ردیف‌ها و سلول‌های صفحه‌گسترده را از طریق JS ویرایش کنید

جزء SlickGrid توسعه دهندگان نرم افزار را قادر می سازد تا سلول های صفحه گسترده را به روش های مختلف در برنامه های جاوا اسکریپت خود مدیریت کنند. این کتابخانه چندین ویژگی مهم را برای مدیریت سلول‌ها، ستون‌ها و ردیف‌های صفحه‌گسترده ارائه کرده است، مانند درج سلول‌های جدید، ویرایش سلول‌های موجود، حذف سلول‌های ناخواسته. همچنین از سایز خودکار ستون ها، تغییر اندازه، مرتب سازی مجدد، نمایش و پنهان کردن ستون ها و ردیف ها با استفاده از دستورات جاوا اسکریپت پشتیبانی می کند.

var d =  $scope.$grid.grid.getData();
$scope.$grid.grid.invalidateRow(d.length);
//Adds the new row as the first row.
d.unshift(item);
$scope.$grid.grid.updateRowCount();
$scope.$grid.grid.setData(d);
$scope.selectedRows = [];
$scope.selectedRows = [0];
//Sets the first row and first column as editable by clicking on it
$scope.$grid.grid.setActiveCell($scope.selectedRows,0);
//$scope.$grid.grid.gotoCell(0,0,true);
var grid = $scope.$grid.grid;
var row = $scope.selectedRows[0];
var col = 0;
grid.setActiveCell(row, col);
grid.editActiveCell(Slick.Acsiom.Editors.Text);

اندازه خودکار ستون از طریق JavaScript API

کامپوننت منبع باز SlickGrid یک ویژگی بسیار مفید برای اعمال اندازه خودکار ستون ها در برنامه های جاوا اسکریپت ارائه کرده است. این یک API اندازه خودکار ستون را ارائه می دهد که شبکه را قادر می سازد تا انتخاب های هوشمندانه ای در مورد عرض ستون های خود بر اساس محتوای سلول هدر و ردیف ها انجام دهد. لطفاً به یاد داشته باشید که داده‌ها باید برای اندازه‌گیری خودکار ارائه شوند و باید داده‌هایی برای آزمایش اندازه وجود داشته باشد، زیرا برای یک الگوریتم اندازه‌گیری خودکار کار بدون هیچ داده‌ای بسیار سخت است.