XLSX: Work with comments on XLSX page

In This Topic

WebSpreadsheetEditorControlJS control allows to work (view, add, edit and delete) with comments to the cells of XLSX worksheet in web browser.
Cell comments can be changed manually using mouse/keyboard or programmatically.

Add a comment to the focused cell of XLSX worksheet

If you want to add a comment to the focused cell of XLSX worksheet using mouse, you should do the following steps:

Select "Review" tab in WebSpreadsheetDocumentEditorControlJS control
Click "Insert comment" button, "Insert comment" dialog will appear, enter the name of comment author, check "Show author" checkbox if the author name should be shown with comment, enter the comment text, click "OK" button, the dialog will be closed and the new comment will be added to the focused cell.

Here is JavaScript code that demonstrates how to add a comment to the focused cell of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();


// prepare parameters of comment

// comment author
var commentAuthor = "Persona";
// a value indicating whether author name must be shown in comment
var showAuthor = true;
// comment text
var commentText = "Test comment text";

// add comment to the focused cell
spreadsheetEditorControl.insertComment(commentAuthor, showAuthor, commentText);

Edit the comment of the focused cell of XLSX worksheet

If you want to edit a comment of the focused cell of XLSX worksheet using mouse, you should do the following steps:

Select "Review" tab in WebSpreadsheetDocumentEditorControlJS control
Click on the comment that should be edited
Click "Edit comment" button, "Edit comment" dialog will appear, change the name of comment author if necessary, change status of "Show author" checkbox if necessary, change the comment text if necessary, click "OK" button, the dialog will be closed and the comment will be updated.

Here is JavaScript code that demonstrates how to change the comment of focused cell of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// if focused cell does not have comment
if (!spreadsheetEditorControl.get_IsCellHasComment()) {
    throw new Error("Focused cell does not have comment.");
}


// prepare parameters of comment

// get the author ("Persona") of focused comment
var author = spreadsheetEditorControl.get_CommentAuthor();
// change the author
author += "2";

// get a value indicating whether author name must be shown in comment
var showAuthor = spreadsheetEditorControl.get_CommentShowAuthor();

// get the text ("Test comment text") of focused comment
var text = spreadsheetEditorControl.get_CommentShowText();
// change the text
text = "Edited " + text;


// edit comment for focused cell
spreadsheetEditorControl.editComment(author, showAuthor, text);

Resize the comment of the focused cell of XLSX worksheet

If you want to resize the comment of the focused cell of XLSX worksheet using mouse, you should do the following steps:

Click on the comment that should be resized and you will see 8 resizing points, which allow to resize the comment using mouse
Click on any resizing point and move mouse to resize the comment

Move the comment of the focused cell of XLSX worksheet

If you want to move (reposition) the comment of the focused cell of XLSX worksheet using mouse, you should do the following steps:

Hover the comment with mouse cursor and you will see the move cursor
Click on the comment and move the mouse to the new position of the comment

Change the font properties of focused comment of XLSX worksheet

If you want to change the font properties of the focused comment of XLSX worksheet using mouse, you should do the following steps:

Select "Home" tab in WebSpreadsheetDocumentEditorControlJS control.
Click on the comment that should be changed.
Use the dropdown elements "Font name" and "Font size" if you want to change the font of focused comment.
Click on buttons "Bold text", "Italic text", "Underline text" or "Strikethrought text" if you want to change bold/italic/underline/strikethrough state of text of focused comment.
Use the color picker "Font color" if you want to change the font color of focused comment.

Here is JavaScript code that demonstrates how to change the font properties of focused comment of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get__spreadsheetDocumentEditorControl();

// if comment is not focused
if (!spreadsheetEditorControl.get_IsCommentFocused()) {
    // if focused cell has comment
    if (spreadsheetEditorControl.get_IsCellHasComment()) {
        // focus the comment of focused cell
        spreadsheetEditorControl.focusCommentFromFocusedCell();
    }
    else {
        throw new Error("Focused cell does not have comment.");
    }
}

// get the font name for focused comment
var fontName = _spreadsheetDocumentEditorControl.get_FontName();
// set new font name
_spreadsheetDocumentEditorControl.set_FontName("Impact");

// get the font size for focused comment
var fontSize = _spreadsheetDocumentEditorControl.get_FontSize();
// set new font size
_spreadsheetDocumentEditorControl.set_FontSize(16);


// get the bold text status for focused comment
var isBold = _spreadsheetDocumentEditorControl.get_IsFontBold();
// set new boldness status
_spreadsheetDocumentEditorControl.set_IsFontBold(true);

// get the italic text status for focused comment
var isItalic = _spreadsheetDocumentEditorControl.get_IsFontItalic();
// set new italic text status
_spreadsheetDocumentEditorControl.set_IsFontItalic(true);

// get the underline text status for focused comment
var isUnderline = _spreadsheetDocumentEditorControl.get_IsFontUnderline();
// set new underline text status
_spreadsheetDocumentEditorControl.set_IsFontUnderline(true);

// get the strikeout text status for focused comment
var isStrikeout = _spreadsheetDocumentEditorControl.get_IsFontStrikeout();
// set new strikeout text status
_spreadsheetDocumentEditorControl.set_IsFontStrikeout(true);


// get font color (for example, "rgba(0,0,0,1)") for focused comment
var fontColor = _spreadsheetDocumentEditorControl.get_FontColor();

// get a string that represents HTML color ("black", "red", "transparent", "rgb(255,255,255)", "rgba(255,255,255,0.5)")
var htmlColor = "teal";
// set new font color
_spreadsheetDocumentEditorControl.set_FontColor(htmlColor);

Change the text properties of focused comment of XLSX worksheet

If you want to change the text properties of the focused comment of XLSX worksheet using mouse, you should do the following steps:

Select "Home" tab in WebSpreadsheetDocumentEditorControlJS control
Click on the comment that should be changed.
Click on buttons "Align left", "Center" or "Align right" if you want to change the horizontal text alignment in the focused comment.
Click on buttons "Top align", "Middle align" or "Bottom align" if you want to change the vertical text alignment in the focused comment.

Here is JavaScript code that demonstrates how to change the text properties of focused comment of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get__spreadsheetDocumentEditorControl();

// if comment not focused
if (!spreadsheetEditorControl.get_IsCommentFocused()) {
    // if focused cell has comment
    if (spreadsheetEditorControl.get_IsCellHasComment()) {
        // focus the comment of focused cell
        spreadsheetEditorControl.focusCommentFromFocusedCell();
    }
    else {
        throw new Error("Focused cell does not have comment.");
    }
}

// get the text horizontal alignment for focused comment
var textHorizontalAlign = _spreadsheetDocumentEditorControl.get_TextHorizontalAlign();

// create value that defines horizontal alignment
var horizontalAlign = Vintasoft.Imaging.Office.WebTextHorizontalAlignEnumJS("Center");
// set new text horizontal alignment
_spreadsheetDocumentEditorControl.set_TextHorizontalAlign(horizontalAlign);


// get the text vertical alignment for focused comment
var textVerticalAlign = _spreadsheetDocumentEditorControl.get_TextVerticalAlign();

// create value that defines vertical alignment
var verticalAlign = Vintasoft.Imaging.Office.WebTextVerticalAlignEnumJS("Bottom");
// set new text vertical alignment
_spreadsheetDocumentEditorControl.set_TextVerticalAlign(verticalAlign);

Change the background color of focused comment of XLSX worksheet

If you want to change the background color of the focused comment of XLSX worksheet using mouse, you should do the following steps:

Select "Home" tab in WebSpreadsheetDocumentEditorControlJS control
Click on the comment that should be changed.
Use the color picker "Fill color"

Here is JavaScript code that demonstrates how to change the background color of focused comment of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// if comment is not focused
if (!spreadsheetEditorControl.get_IsCommentFocused()) {
    // if focused cell has comment
    if (spreadsheetEditorControl.get_IsCellHasComment()) {
        // focus the comment of focused cell
        spreadsheetEditorControl.focusCommentFromFocusedCell();
    }
    else {
        throw new Error("Focused cell does not have comment.");
    }
}

// get the background color (for example, "rgba(255,255,225,1)") of focused comment
var backgroundColor = _spreadsheetDocumentEditorControl.get_FillColor();

// create a string that represents HTML color ("black", "red", "transparent", "rgb(255,255,255)", "rgba(255,255,255,0.5)")
var htmlColor = "rgb(200,150,200)";
// set new background color for focused comment
_spreadsheetDocumentEditorControl.set_FillColor(htmlColor);

Delete the comment of focused cell of XLSX worksheet

If you want to delete the focused comment of XLSX worksheet using mouse, you should do the following steps:

Select "Review" tab in WebSpreadsheetDocumentEditorControlJS control
Click on the comment that should be deleted
Click "Delete comment" button and the comment will be deleted.

Here is JavaScript code that demonstrates how to delete the comment of the focused cell of XLSX worksheet:

JavaScript

// _spreadsheetDocumentEditorControl is an instance of WebSpreadsheetDocumentEditorControlJS class

// get spreadsheet editor
var spreadsheetEditorControl = _spreadsheetDocumentEditorControl.get_SpreadsheetEditorControl();

// if focused cell does not have comment
if (!spreadsheetEditorControl.get_IsCellHasComment()) {
    throw new Error("Focused cell does not have comment.");
}

// delete comment in focused cell
spreadsheetEditorControl.deleteComment();

Send Feedback