Access and Update the Portions of Rich Text of Cell
Contents
[
Hide
]
Aspose.Cells for JavaScript via C++ allows you to access and update the portions of the rich text of a cell. For this purpose, you can use Cell.characters and Cell.characters properties. These properties will return and accept an array of FontSetting objects, which you can use to access and update various font properties such as font name, font color, boldness, etc.
Access and Update the Portions of Rich Text of Cell
The following code demonstrates the usage of the Cell.characters and Cell.characters property using the source Excel file, which you can download from the provided link. The source Excel file contains rich text in cell A1. It has three portions, and each portion uses a different font. The following code snippet accesses these portions and updates the first portion with a new font name. Finally, it saves the workbook as the output Excel file. When you open it, you will find that the font of the first portion of the text has changed to “Arial”.
JavaScript code to access and update the portions of Rich Text of Cell
<!DOCTYPE html>
<html>
<head>
<title>Aspose.Cells Example</title>
</head>
<body>
<h1>Update Cell Character Font Example</h1>
<input type="file" id="fileInput" accept=".xls,.xlsx,.csv" />
<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;
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 () => {
const fileInput = document.getElementById('fileInput');
const resultDiv = document.getElementById('result');
if (!fileInput.files.length) {
resultDiv.innerHTML = '<p style="color: red;">Please select an Excel file.</p>';
return;
}
// Ensure Aspose.Cells is initialized
await readyPromise;
const file = fileInput.files[0];
const arrayBuffer = await file.arrayBuffer();
// Instantiate workbook from uploaded file
const workbook = new Workbook(new Uint8Array(arrayBuffer));
// Access first worksheet and its cells
const cells = workbook.worksheets.get(0).cells;
const cell = cells.get("A1");
console.log("Before updating the font settings....");
let fnts = cell.characters;
const count = fnts.length;
for (let i = 0; i < count; i++) {
console.log(fnts[i].font.name);
}
// Modify the first FontSetting Font Name
fnts[0].font.name = "Arial";
// And update it using characters property
cell.characters = fnts;
console.log("After updating the font settings....");
fnts = cell.characters;
for (let i = 0; i < count; i++) {
console.log(fnts[i].font.name);
}
// Save workbook and provide download link
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';
downloadLink.textContent = 'Download Excel File';
resultDiv.innerHTML = '<p style="color: green;">Operation completed successfully! Click the download link to get the modified file.</p>';
});
</script>
</html>
Console output generated by the sample code
Before updating the font settings....
Century
Courier New
Verdana
After updating the font settings....
Arial
Courier New
Verdana