[]
DEMOS DOC DESIGNER API
DOWNLOAD
(Showing Draft Content)

행 필터 동작 사용자 정의

필터링 전후 동작을 사용자 정의할 수 있습니다.

행 필터 작업을 사용자 정의하려면 다음과 같이 수행합니다:

  1. RowFilterBase를 상속한 새 클래스를 생성합니다.

  2. onFilter 메서드를 오버라이드하고 필터 동작을 처리합니다.

필터 해제 동작을 사용자 정의하려면 다음과 같이 수행합니다:

  1. RowFilterBase를 상속한 새 클래스를 생성합니다.

  2. onFilter메서드를 오버라이드하고 필터 해제 동작을 처리합니다.

다음 이미지는 사용자 정의 필터 동작을 사용하여 강조된 행들을 보여줍니다.


코드 예시

다음 코드는 RowFilterBase 클래스를 확장하고 onFilter 메서드를 오버라이드하여 필터링된 행을 강조하는 방법을 보여줍니다.

$(function () {
    var spread = new GC.Spread.Sheets.Workbook($("#ss")[0]);
    var activeSheet = spread.getActiveSheet();
    spread.suspendPaint();
    activeSheet.setColumnWidth(0, 100);
    activeSheet.setColumnWidth(1, 200);
    activeSheet.addSpan(0, 0, 1, 2);
    activeSheet.getCell(0, 0).value("Students' Math Scores").hAlign(GC.Spread.Sheets.HorizontalAlign.center);
    activeSheet.setValue(1, 0, "Name");
    activeSheet.setValue(1, 1, "SCORE");
    var score = [
        {name: "Simon", score: 59},
        {name: "Jack", score: 70},
        {name: "Lily", score: 86},
        {name: "Bob", score: 54},
        {name: "Lucy", score: 84},
        {name: "John", score: 99}
    ];
    for (var i = 0, len = score.length; i < len; i++) {
        var student = score[i];
        activeSheet.setValue(i + 2, 0, student.name);
        activeSheet.setValue(i + 2, 1, student.score);
    }
    var b1 = new GC.Spread.Sheets.CellTypes.Button();
    b1.text("Filter Score < 60");
    activeSheet.setCellType(8, 1, b1);
    var b2 = new GC.Spread.Sheets.CellTypes.Button();
    b2.text("Unfilter this column");
    activeSheet.setCellType(9, 1, b2);

    function HighLightFilter(range) {
        GC.Spread.Sheets.Filter.RowFilterBase.call(this, range);
    }
    HighLightFilter.prototype = new GC.Spread.Sheets.Filter.RowFilterBase();
    HighLightFilter.prototype.onFilter = function (args) {
        if (!args) {
            return;
        }
        var sheet = args.sheet, range = args.range, filterRows = args.filteredRows, filterActionType = args.action;
        if (filterActionType === GC.Spread.Sheets.Filter.FilterActionType.Filter) {
            if (range.col < 0) {
                range.col = 0;
                range.colCount = sheet.getColumnCount();
            }
            for (var i = 0, len = filterRows.length; i < len; i++) {
                var r = filterRows[i];
                for (var c = range.col, len1 = range.col + range.colCount; c < len1; c++) {
                    sheet.getCell(r, c).backColor("red");
                }
            }
            sheet.setValue(9, 1, "Highlight the score less than 60");
        } else if (filterActionType === GC.Spread.Sheets.Filter.FilterActionType.Unfilter) {
            if (range.col < 0) {
                range.col = 0;
                range.colCount = sheet.getColumnCount();
            }
            for (var i = 0, len = filterRows.length; i < len; i++) {
                var r = filterRows[i];
                for (var c = range.col, len1 = range.col + range.colCount; c < len1; c++) {
                    sheet.getCell(r, c).backColor(undefined);
                }
            }
        }
    }
    var hlf = new HighLightFilter(new GC.Spread.Sheets.Range(2, 1, 6, 1));
    activeSheet.rowFilter(hlf);
    var condition = new GC.Spread.Sheets.ConditionalFormatting.Condition(GC.Spread.Sheets.ConditionalFormatting.ConditionType.NumberCondition,
            {
                compareType: GC.Spread.Sheets.ConditionalFormatting.GeneralComparisonOperators.LessThan,
                expected: 60
            });
    hlf.addFilterItem(1, condition);
    hlf.filterButtonVisible(false);
    spread.bind(GC.Spread.Sheets.Events.ButtonClicked, function (e, args) {
        if (args.row === 8) {
            if (args.col !== undefined) {
                hlf.filter(args.col);
            }
        } else if (args.row === 9) {
            if (args.col !== undefined) {
                hlf.unfilter(args.col);
            }
        }
    });
    spread.resumePaint(); 
});