Analyzing your prompt, please hold on...
An error occurred while retrieving the results. Please refresh the page and try again.
getPageFields() collection, and you can drive the filter in single-select mode, clear it to show every filter item, or switch the field to multi-select so users can pick several filter items at once through the checkbox UI in Excel.
A filter field is a pivot field that controls which subset of the source data the pivot body displays. End users see it as a dropdown at the top of a rendered pivot in Excel, and selecting one of the available filter items rebuilds the pivot body so that only the records belonging to that filter item are summarized. A pivot field becomes a filter field when it is registered as PivotFieldType.Page rather than PivotFieldType.Row, PivotFieldType.Column, or PivotFieldType.Data.
addFieldToAreaThe following example builds a small Fruit / Year / Amount dataset, places a pivot table at cell E3 with Fruit on the row area, Amount on the data area, and Year on the filter area, refreshes the pivot, and saves the workbook.
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example</title>
</head>
<body>
<h1>Aspose.Cells Example</h1>
<button id="runExample">Run Example</button>
<a id="downloadLink" style="display: none;">Download Result</a>
<div id="result"></div>
</body>
<script src="aspose.cells.js.min.js"></script>
<script type="text/javascript">
const { Workbook, SaveFormat } = AsposeCells;
AsposeCells.onReady({
license: "/lic/aspose.cells.enc",
fontPath: "/fonts/",
fontList: ["arial.ttf", "NotoSansSC-Regular.ttf"]
}).then(() => {
console.log("Aspose.Cells initialized");
});
document.getElementById('runExample').addEventListener('click', async () => {
// Create a new workbook
const workbook = new Workbook();
const worksheet = workbook.worksheets.get(0);
worksheet.name = "Data";
// Set up the header row
const cells = worksheet.cells;
cells.get("A1").value = "Fruit";
cells.get("B1").value = "Year";
cells.get("C1").value = "Amount";
// Populate 9 rows of sample data: Fruit, Year, Amount
const data = [
["apple", 2020, 100],
["banana", 2021, 200],
["apple", 2021, 150],
["grape", 2020, 120],
["orange", 2022, 180],
["banana", 2020, 90],
["grape", 2021, 130],
["apple", 2022, 170],
["orange", 2021, 110]
];
for (let i = 0; i < data.length; i++) {
cells.get(i + 1, 0).value = data[i][0];
cells.get(i + 1, 1).value = data[i][1];
cells.get(i + 1, 2).value = data[i][2];
}
// Add a pivot table anchored at cell E3
const pivotTable = worksheet.pivotTables.add("=A1:C10", 2, 4);
// Add fields to their areas: Fruit as Row, Amount as Data, Year as Page field
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Row, "Fruit");
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Data, "Amount");
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Page, "Year");
// Refresh and calculate the pivot table data
pivotTable.calculateData();
// Save the workbook
const outputData = workbook.save(SaveFormat.Xlsx);
const blob = new Blob([outputData]);
const downloadLink = document.getElementById('downloadLink');
downloadLink.href = URL.createObjectURL(blob);
downloadLink.download = "pageFieldSample.xlsx";
downloadLink.style.display = "block";
document.getElementById('result').innerHTML = '<p style="color: green;">Done! Click the download link to get the result file.</p>';
});
</script>
</html>
getPageFields().addWhen you already work with a PivotField instance, you can pass it directly to pivotTable.getPageFields().add(pivotField). The pivot table and filter field are constructed exactly as in the previous scenario; only the final filter-area registration is replaced with the lower-level API call.
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example</title>
</head>
<body>
<h1>Aspose.Cells Example</h1>
<button id="runExample">Run Example</button>
<a id="downloadLink" style="display: none;">Download Result</a>
<div id="result"></div>
</body>
<script src="aspose.cells.js.min.js"></script>
<script type="text/javascript">
const { Workbook, SaveFormat } = AsposeCells;
AsposeCells.onReady({
license: "/lic/aspose.cells.enc",
fontPath: "/fonts/",
fontList: ["arial.ttf", "NotoSansSC-Regular.ttf"]
}).then(() => {
console.log("Aspose.Cells initialized");
});
document.getElementById('runExample').addEventListener('click', async () => {
// — The pivot table and page field are constructed exactly as in
// Scenario 1a (Fruit/Year/Amount data, pivot at E3, Fruit→Row,
// Amount→Data). Below we obtain the Year PivotField from the
// BaseFields collection and pass it to PageFields.Add — the
// low-level alternative to AddFieldToArea. The result is
// functionally identical to Scenario 1a.
const workbook = new Workbook();
const sheet = workbook.worksheets.get(0);
// Headers
sheet.cells.get("A1").value = "Fruit";
sheet.cells.get("B1").value = "Year";
sheet.cells.get("C1").value = "Amount";
// Sample data (9 rows)
sheet.cells.get("A2").value = "apple"; sheet.cells.get("B2").value = "2020"; sheet.cells.get("C2").value = 100;
sheet.cells.get("A3").value = "apple"; sheet.cells.get("B3").value = "2021"; sheet.cells.get("C3").value = 150;
sheet.cells.get("A4").value = "apple"; sheet.cells.get("B4").value = "2022"; sheet.cells.get("C4").value = 200;
sheet.cells.get("A5").value = "grape"; sheet.cells.get("B5").value = "2020"; sheet.cells.get("C5").value = 300;
sheet.cells.get("A6").value = "grape"; sheet.cells.get("B6").value = "2021"; sheet.cells.get("C6").value = 400;
sheet.cells.get("A7").value = "grape"; sheet.cells.get("B7").value = "2022"; sheet.cells.get("C7").value = 500;
sheet.cells.get("A8").value = "blueberry"; sheet.cells.get("B8").value = "2020"; sheet.cells.get("C8").value = 250;
sheet.cells.get("A9").value = "blueberry"; sheet.cells.get("B9").value = "2021"; sheet.cells.get("C9").value = 350;
sheet.cells.get("A10").value = "blueberry"; sheet.cells.get("B10").value = "2022"; sheet.cells.get("C10").value = 450;
// Add pivot table at E3 covering A1:C10
const pivotTable = sheet.pivotTables.add("=A1:C10", 2, 4);
// Fruit -> Row, Amount -> Data (Year will go to Page below)
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Row, "Fruit");
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Data, "Amount");
// Low-level approach: grab the existing Year PivotField from BaseFields
// and register it in the Page area via PageFields.Add(PivotField).
const yearField = pivotTable.baseFields.get("Year");
pivotTable.pageFields.add(yearField);
// Refresh so the new page field is reflected in the saved workbook
pivotTable.calculateData();
const outputData = workbook.save(SaveFormat.Xlsx);
const blob = new Blob([outputData]);
const downloadLink = document.getElementById('downloadLink');
downloadLink.href = URL.createObjectURL(blob);
downloadLink.download = "output.xlsx";
downloadLink.style.display = "block";
document.getElementById('result').innerHTML = '<p style="color: green;">Done! Click the download link to get the result file.</p>';
});
</script>
</html>
In the default single-select behavior, the filter field renders as a single dropdown and the pivotField.currentPageItem integer selects which filter item drives the pivot body. Assigning a specific index picks that one item; assigning the special sentinel 0x7FFD (decimal 32765) clears the filter so every filter item is summarized at once. Single-select is the default; you do not need to enable it explicitly.
Setting currentPageItem to the magic value 0x7FFD is equivalent to clearing the filter: the pivot body summarizes every filter item as if no filter were applied.
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example</title>
</head>
<body>
<h1>Aspose.Cells Example</h1>
<button id="runExample" disabled>Run Example</button>
<a id="downloadLink" style="display: none;">Download Result</a>
<div id="result"></div>
<script src="aspose.cells.js.min.js"></script>
<script type="text/javascript">
const { Workbook, SaveFormat } = AsposeCells;
const readyPromise = AsposeCells.onReady({
license: "/lic/aspose.cells.enc",
fontPath: "/fonts/",
fontList: ["arial.ttf", "NotoSansSC-Regular.ttf"]
}).then(() => {
console.log("Aspose.Cells initialized");
document.getElementById('runExample').disabled = false;
});
document.getElementById('runExample').addEventListener('click', async () => {
// Create a new workbook
const workbook = new Workbook();
const sheet = workbook.worksheets.get(0);
// Populate Fruit/Year/Amount data
const cells = sheet.cells;
cells.get("A1").value = "Fruit";
cells.get("B1").value = "Year";
cells.get("C1").value = "Amount";
const data = [
["Apple", 2022, 100],
["Apple", 2023, 150],
["Banana", 2022, 80],
["Banana", 2023, 120],
["Cherry", 2022, 200],
["Cherry", 2023, 250]
];
for (let r = 0; r < data.length; r++) {
for (let c = 0; c < data[r].length; c++) {
cells.get(r + 1, c).value = data[r][c];
}
}
// Create pivot table at E3
const pivotTables = sheet.pivotTables;
const pivotTable = pivotTables.add("=A1:C7", 2, 4);
// Configure pivot fields: Fruit→Row, Amount→Data, Year→Page
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Row, "Fruit");
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Data, "Amount");
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Page, "Year");
pivotTable.calculateData();
// Clear the page filter so every item in the page field is visible.
// 0x7FFD (decimal 32765) is the special sentinel value that means "all items" —
// equivalent to selecting "(All)" in Excel's page-field dropdown.
pivotTable.pageFields.get(0).currentPageItem = 0x7FFD;
const outputData = workbook.save(SaveFormat.Xlsx);
const blob = new Blob([outputData]);
const downloadLink = document.getElementById('downloadLink');
downloadLink.href = URL.createObjectURL(blob);
downloadLink.download = "output.xlsx";
downloadLink.style.display = "block";
document.getElementById('result').innerHTML = '<p style="color: green;">Done! Click the download link to get the result file.</p>';
});
</script>
</body>
</html>
Setting currentPageItem to a real index picks just that one filter item. The index is the position of the item in the filter field’s sorted item list, so for example 1 selects the second item after sorting.
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example</title>
</head>
<body>
<h1>Aspose.Cells Example</h1>
<button id="runExample">Run Example</button>
<a id="downloadLink" style="display: none;">Download Result</a>
<div id="result"></div>
<script src="aspose.cells.js.min.js"></script>
<script type="text/javascript">
const { Workbook, SaveFormat } = AsposeCells;
const readyPromise = AsposeCells.onReady({
license: "/lic/aspose.cells.enc",
fontPath: "/fonts/",
fontList: ["arial.ttf", "NotoSansSC-Regular.ttf"]
}).then(() => {
console.log("Aspose.Cells initialized");
});
document.getElementById("runExample").addEventListener("click", async () => {
// Create workbook
const workbook = new Workbook();
const sheet = workbook.worksheets.get(0);
const cells = sheet.cells;
// Add sample data (Fruit/Year/Amount)
cells.get("A1").value = "Fruit";
cells.get("B1").value = "Year";
cells.get("C1").value = "Amount";
cells.get("A2").value = "Apple";
cells.get("B2").value = "2020";
cells.get("C2").value = "100";
cells.get("A3").value = "Apple";
cells.get("B3").value = "2021";
cells.get("C3").value = "150";
cells.get("A4").value = "Banana";
cells.get("B4").value = "2020";
cells.get("C4").value = "200";
cells.get("A5").value = "Banana";
cells.get("B5").value = "2021";
cells.get("C5").value = "250";
// Add pivot table at E3
const pivotTables = sheet.pivotTables;
const pivotTable = pivotTables.add("=A1:C5", 2, 4);
// Add fields: Fruit→Row, Amount→Data, Year→Page
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Row, "Fruit");
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Data, "Amount");
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Page, "Year");
// Page-field-specific operations
pivotTable.pageFields.get(0).currentPageItem = 1; // 1 = second item in sorted order (e.g. "2021")
// Refresh and calculate pivot table
pivotTable.calculateData();
const outputData = workbook.save(SaveFormat.Xlsx);
const blob = new Blob([outputData]);
const downloadLink = document.getElementById("downloadLink");
downloadLink.href = URL.createObjectURL(blob);
downloadLink.download = "output.xlsx";
downloadLink.style.display = "block";
document.getElementById("result").innerHTML =
'<p style="color: green;">Done! Click the download link to get the result file.</p>';
});
</script>
</body>
</html>
Multi-select filtering turns the filter dropdown into a checkbox list and lets the end user pick several filter items simultaneously. Aspose.Cells exposes two properties that work together. pivotField.isMultipleItemSelectionAllowed must be set to true before the multi-select UI takes effect at all. After it is enabled, pivotItem.isHidden controls which items appear in the checkbox list, so you can either show every item or whitelist only specific items.
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example</title>
</head>
<body>
<h1>Aspose.Cells Example</h1>
<button id="runExample">Run Example</button>
<a id="downloadLink" style="display: none;">Download Result</a>
<div id="result"></div>
<script src="aspose.cells.js.min.js"></script>
<script type="text/javascript">
const { Workbook } = AsposeCells;
const initializationPromise = AsposeCells.onReady({
license: "/lic/aspose.cells.enc",
fontPath: "/fonts/",
fontList: ["arial.ttf", "NotoSansSC-Regular.ttf"]
}).then(() => {
console.log("Aspose.Cells initialized");
});
document.getElementById('runExample').addEventListener('click', async () => {
await initializationPromise;
// — The pivot table and page field are constructed exactly as in
// Scenario 1a (Fruit/Year/Amount data, pivot at E3, Fruit→Row,
// Amount→Data, Year→Page via AddFieldToArea).
// Below we apply multi-select filtering on the page field.
const workbook = new Workbook();
const sheet = workbook.worksheets.get(0);
const cells = sheet.cells;
// Sample data: Fruit | Year | Amount
cells.get(0, 0).value = "Fruit";
cells.get(0, 1).value = "Year";
cells.get(0, 2).value = "Amount";
const data = [
["apple", "2019", "100"],
["apple", "2020", "150"],
["apple", "2021", "200"],
["banana", "2019", "110"],
["banana", "2020", "160"],
["banana", "2021", "210"],
["grape", "2019", "120"],
["grape", "2020", "170"],
["grape", "2021", "220"]
];
for (let i = 0; i < data.length; i++) {
cells.get(i + 1, 0).value = data[i][0];
cells.get(i + 1, 1).value = Number(data[i][1]);
cells.get(i + 1, 2).value = Number(data[i][2]);
}
const pivotSheet = workbook.worksheets.add("Pivot");
const pivots = pivotSheet.pivotTables;
const pivotTable = pivots.add("=A1:C10", 2, 4);
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Row, "Fruit");
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Data, "Amount");
pivotTable.addFieldToArea(AsposeCells.PivotFieldType.Page, "Year");
// — Enable multi-select on the page field
const pageField = pivotTable.pageFields.get(0);
pageField.isMultipleItemSelectionAllowed = true;
const pivotItems = pageField.pivotItems;
// Part A — select ALL items (make every item visible)
for (let i = 0; i < pivotItems.count; i++) {
pivotItems.get(i).isHidden = false;
}
// Part B — select only specific items by source value
for (let i = 0; i < pivotItems.count; i++) {
const pivotItem = pivotItems.get(i);
switch (pivotItem.getStringValue()) {
case "2020":
case "grape":
case "blueberry":
pivotItem.isHidden = false;
break;
default:
pivotItem.isHidden = true;
break;
}
}
pivotTable.calculateData();
const outputData = workbook.save(AsposeCells.SaveFormat.Xlsx);
const blob = new Blob([outputData]);
const downloadLink = document.getElementById('downloadLink');
downloadLink.href = URL.createObjectURL(blob);
downloadLink.download = "output.xlsx";
downloadLink.style.display = "block";
document.getElementById('result').innerHTML =
'<p style="color: green;">Done! Click the download link to get the result file.</p>';
});
</script>
</body>
</html>
Note: When using multi-select filtering through
pivotItem.isHidden, at least onePivotItemmust remain visible (isHidden === false). If every item is hidden, Excel either crashes when opening the file or renders a blank pivot. Always verify that your multi-select whitelist includes at least one item from your source data.
The table below summarizes when to use each API and mode so you can pick the right combination without reading every scenario in detail.
| Scenario / Use Case | Recommended API | Property Used | Notes |
|---|---|---|---|
| Add a filter field by source-column name (most common) | pivotTable.addFieldToArea(PivotFieldType.Page, "fieldName") |
n/a | High-level, one-line. Use this unless you need a PivotField reference. |
Add a filter field when you already have a PivotField object |
pivotTable.getPageFields().add(pivotField) |
n/a | Use when the field object was obtained elsewhere or needs to be reused. |
| Filter to a single filter item (default mode) | pivotField.currentPageItem |
set to a specific index | For example, 1 shows the second item in the sorted list. |
| Show all items / clear the filter | pivotField.currentPageItem |
set to 0x7FFD |
The magic value 0x7FFD (decimal 32765) is the sentinel for “all items”. |
| Enable multi-select UI in Excel | pivotField.isMultipleItemSelectionAllowed |
set to true |
Required before any isHidden assignments take effect. |
| Hide / show individual items in a multi-select list | pivotItem.isHidden |
set per item | At least one item must remain visible (isHidden === false). |
PivotItem in a multi-select filter field is hidden, Excel crashes on open or renders a blank pivot. Build your whitelist against your source data so at least one item stays visible, and your saved workbooks will open reliably on every machine.
Analyzing your prompt, please hold on...
An error occurred while retrieving the results. Please refresh the page and try again.