Sürətli Göstərmə və Emal üçün Pulsuz JavaScript Cədvəli Komponenti

Open Source Free JavaScript Spreadsheet komponenti sürətli göstərməyə, sətirləri idarə etməyə, sütunların avtomatik ölçüsünü, hüceyrələrin idarə edilməsinə və s. imkan verir.

Çox sürətli tam açıq mənbəli JavaScript şəbəkəsi/elektron cədvəl komponenti proqram tərtibatçılarına xüsusi idarəetmə və displeylərlə zəngin şəbəkələr yaratmağa imkan verir. Komponent istifadəçilərə heç bir performans azalması olmadan yüz minlərlə elementlə işləmək imkanı verən virtual göstərməyi dəstəkləyir. Bu o deməkdir ki, SlickGrid 100 cərgə və ya 100 min cərgə ilə performansa xələl gətirmədən idarə edə bilir. Əvvəllər jQuery UI Mövzularını dəstəkləmək üçün istifadə olunurdu, lakin SlickGrid 3.0.0-dan komanda bütün əlaqəli kodu sildi və onu daha müasir SortableJS ilə əvəz etdi.

SlickGrid komponenti tamamilə fərdiləşdirilə bilər və son dərəcə sürətli göstərmə sürətini təmin edir. Komponent elektron cədvəlləri idarə etmək üçün bir sıra vacib funksiyaları ehtiva edir, məsələn, cədvəllərin göstərilməsi, daha zəngin xanalar üçün arxa planın sonrakı göstərilməsi, klaviatura naviqasiyası, sütunların ölçüsünün dəyişdirilməsi, sütunların yenidən sıralanması, sütun və ya sətirlərin göstərilməsi/gizlədilməsi, yeni sətirlərin daxil edilməsi, yeni sətirlərin redaktəsi, çoxlu geri alma/təkrar dəstəyi ilə sahə redaktorları, formatlaşdırma və üslublar əlavə etmək və s. Məlumat mərkəzli çərçivələr və Bootstrap ilə uyğun gəlir

Previous Next

SlickGrid ilə işə başlamaq

SlickGrid-i quraşdırmanın tövsiyə olunan yolu npm-dən istifadə etməkdir, SlickGrid-i quraşdırmaq üçün brauzerə aşağıdakı skript teqini əlavə etmək kifayətdir.

npm vasitəsilə SlickGrid quraşdırın

npm install slickgrid 

Siz GitHub repozitoriyasından yığılmış paylaşılan kitabxananı endirə və quraşdıra bilərsiniz.

JavaScript API istifadə edərək hüceyrələri necə birləşdirmək olar?

Cədvəl daxilində xanaların birləşdirilməsi çox faydalı xüsusiyyətdir və tez-tez mətni bir neçə sətir və ya sütunda mərkəzləşdirmək üçün istifadə olunur və iki və ya daha çox xananın məlumat sətirlərini birləşdirmək üçün faydalı ola bilər. Onun əsas məqsədi verilənləri son istifadəçi üçün təqdim edilə bilən və oxuna bilən etməkdir. Açıq mənbəli SlickGrid JavaScript komponenti proqram tərtibatçılarına öz JavaScript proqramlarında çoxlu xana, sətir və ya sütunu birləşdirməyə imkan verir.

JavaScript API vasitəsilə elektron cədvəl hüceyrələrinin birləşməsi

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 vasitəsilə elektron cədvəl sütunlarını, sətirləri və xanaları redaktə edin

SlickGrid komponenti proqram tərtibatçılarına elektron cədvəl hüceyrələrini JavaScript proqramlarında müxtəlif üsullarla idarə etməyə imkan verir. Kitabxana elektron cədvəl xanaları, sütunları və sətirləri ilə işləmək üçün yeni xanalar daxil etmək, mövcud xanaları redaktə etmək, istənməyən xanaları silmək kimi bir sıra vacib funksiyaları təmin etmişdir. O, həmçinin JavaScript əmrlərindən istifadə edərək sütunların və sətirlərin avtomatik ölçülməsi, ölçüsünün dəyişdirilməsi, yenidən sıralanması, göstərilməsi və gizlədilməsi üçün dəstək təmin etmişdir.

JavaScript API vasitəsilə Yeni Sıra əlavə edin və Hüceyrəni redaktə etmək üçün klikləyin

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 vasitəsilə Sütun Ölçüsü Avtomatik

Açıq mənbəli SlickGrid komponenti JavaScript proqramlarında avtomatik sütun ölçüsünü tətbiq etmək üçün çox faydalı xüsusiyyət təmin etmişdir. O, başlığın və sətirlərin xana məzmununa əsaslanaraq, şəbəkəyə öz sütunlarının eni haqqında ağıllı seçimlər etməyə imkan verən sütunun avtomatik ölçüsünü təyin edən API təmin edir. Xahiş edirik unutmayın ki, verilənlər avtomatik ölçü üçün təqdim edilməlidir və ölçüsünü yoxlamaq üçün verilənlər mövcud olmalıdır, çünki avtomatlaşdırılmış ölçü alqoritminin heç bir məlumat olmadan işləməsi çox çətindir.

 Azəri