مكون جدول بيانات جافا سكريبت مجاني للتقديم والمعالجة السريعة

الشروع في العمل مع SlickGrid

الطريقة الموصى بها لتثبيت SlickGrid ، هي استخدام npm ، لتثبيت SlickGrid ، ما عليك سوى إضافة علامة البرنامج النصي التالية في المستعرض.

npm install slickgrid 

يمكنك تنزيل المكتبة المشتركة المجمعة من مستودع GitHub وتثبيتها.

كيفية دمج الخلايا باستخدام JavaScript API؟

يعد دمج الخلايا داخل جدول بيانات ميزة مفيدة للغاية والتي غالبًا ما تستخدم لتوسيط النص عبر عدة صفوف أو أعمدة ويمكن أن يكون مفيدًا في دمج سلاسل البيانات لخليتين أو أكثر. والغرض الرئيسي منه هو جعل البيانات قابلة للعرض وقابلة للقراءة للمستخدم النهائي. يسمح مكون جافا سكريبت 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 مطوري البرامج من التعامل مع خلايا جداول البيانات بطرق مختلفة داخل تطبيقات JavaScript الخاصة بهم. قدمت المكتبة العديد من الميزات المهمة للتعامل مع خلايا جداول البيانات والأعمدة والصفوف مثل إدراج خلايا جديدة وتحرير الخلايا الموجودة وحذف الخلايا غير المرغوب فيها. كما قدم دعمًا لأعمدة التحجيم التلقائي ، وتغيير حجم الأعمدة والصفوف وإعادة ترتيبها وعرضها وإخفائها باستخدام أوامر JavaScript.

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 مفتوح المصدر ميزة مفيدة للغاية لتطبيق تغيير حجم العمود التلقائي داخل تطبيقات JavaScript. يوفر واجهة برمجة تطبيقات لتخصيص الأعمدة تلقائيًا تمكن الشبكة من إجراء تحديدات ذكية حول عرض أعمدتها بناءً على محتوى الخلية للرأس والصفوف. يرجى تذكر أنه يجب توفير البيانات للتحجيم التلقائي وأنه يجب أن تكون هناك بيانات موجودة لاختبار الحجم لأنه من الصعب جدًا أن تعمل خوارزمية التحجيم الآلي بدون أي بيانات.