Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
68 changes: 54 additions & 14 deletions Document-Processing/Word/Word-Processor/asp-net-core/bookmark.md
Original file line number Diff line number Diff line change
@@ -1,58 +1,98 @@
---
layout: post
title: Bookmark in Document Editor Component | Syncfusion
description: Learn here all about Bookmark in Syncfusion Document Editor component of Syncfusion Essential JS 2 and more.
title: Bookmark in DOCX Editor Component | Syncfusion
description: Learn here all about Bookmark in Syncfusion DOCX Editor component of Syncfusion Essential JS 2 and more.
platform: document-processing
control: Bookmark
documentation: ug
---


# Bookmarks in Document Editor Component
# Bookmarks in ASP.NET Core DOCX Editor Component

Bookmark is a powerful tool that helps to mark a place in the document to find again easily. You can enter many bookmarks in the document and give each one a unique name to identify easily.

[ASP.NET Core DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/asp-net-core-docx-editor) (Document Editor) provides built-in dialog to add, delete, and navigate bookmarks within the document. To add a bookmark, select a portion of text in the document. After that, jump to the location or add links to it within the document using built-in hyperlink dialog. You can also delete bookmarks from a document.
[ASP.NET Core DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/asp-net-core-docx-editor) (Document Editor) provides a built-in dialog to add, delete, and navigate bookmarks within the document. To add a bookmark, select a portion of text in the document. After that, jump to the location or add links to it within the document using the built-in hyperlink dialog. You can also delete bookmarks from a document.

N>Bookmark names need to begin with a letter. They can include both numbers and letters, but not spaces. To separate the words, use an underscore.Bookmark names starting with an underscore are called hidden bookmarks. For example, bookmarks generated for table of contents.
N>Bookmark names need to begin with a letter. They can include both numbers and letters, but not spaces. To separate the words, use an underscore. Bookmark names starting with an underscore are called hidden bookmarks. For example, bookmarks generated for table of contents.

## Add bookmark

Using [`insertBookmark`] method, Bookmark can be added to the selected text.
Using the [`insertBookmark`] method, bookmark can be added to the selected text.

```csharp
container.documentEditor.editor.insertBookmark("Bookmark1");
```

## Select Bookmark

You can select the bookmark in the document using [`selectBookmark`] method by providing Bookmark name to select as shown in the following code snippet.
You can select the bookmark in the document using the [`selectBookmark`] method by providing the bookmark name to select as shown in the following code snippet.

```csharp
container.documentEditor.selection.selectBookmark("Bookmark1");
container.documentEditor.selection.selectBookmark("Bookmark1", true);
```

N> The second parameter is optional and it denotes whether to exclude the bookmark start and end from the selection. If true, excludes bookmark start and end from selection.

## Delete Bookmark

You can delete bookmark in the document using [`deleteBookmark`] method as shown in the following code snippet.
You can delete the bookmark in the document using the [`deleteBookmark`] method as shown in the following code snippet.

```csharp
container.documentEditor.editor.deleteBookmark("Bookmark1");
```

## Get Bookmark
## Get Bookmark from Document

You can get all the bookmarks in the document using [`getBookmarks`] method as shown in the following code snippet.
You can get all the bookmarks in the document using the [`getBookmarks`] method on the `DocumentEditor` instance as shown in the following code snippet.

```csharp
container.documentEditor.getBookmarks(false);
```

N> The boolean parameter denotes whether to include hidden bookmarks. If false, hidden bookmarks are ignored.

## Get Bookmark from Selection

You can get bookmarks in the current selection in the document using the [`getBookmarks`] method on the `Selection` instance as shown in the following code snippet.

```csharp
container.documentEditor.selection.getBookmarks(false);
```

N> Parameter denotes is include hidden bookmarks. If false, ignore hidden bookmark.
## Show or Hide Bookmark

You can show or hide the bookmark indicators around bookmarked items in DOCX Editor component.

The following example code illustrates how to show or hide the bookmark indicators around bookmarked items.

```csharp
container.documentEditor.documentEditorSettings.showBookmarks = true;
```

## Replace Bookmark Content

### Preserve the Bookmark While Replacing Content

When you pass `true` for the `excludeStartEnd` parameter in `selectBookmark`, the bookmark start and end markers are preserved. The subsequent `insertText` call replaces only the content between the markers, so the bookmark remains intact and can be tracked later.

```csharp
container.documentEditor.selection.selectBookmark("Bookmark1", true);
container.documentEditor.editor.insertText("Hello World");
```

### Remove the Bookmark While Replacing Content

When you omit the `excludeStartEnd` parameter (or pass `false`), the bookmark start and end markers are included in the selection. The subsequent `insertText` call replaces both the content and the markers, so the bookmark is removed and cannot be tracked later.

```csharp
container.documentEditor.selection.selectBookmark("Bookmark1");
container.documentEditor.editor.insertText("Hello World");
```

## Bookmark Dialog

The following example shows how to open bookmark dialog in Document Editor.
The following example shows how to open the bookmark dialog in DOCX Editor.

{% tabs %}
{% highlight cshtml tabtitle="CSHTML" %}
Expand All @@ -65,7 +105,7 @@ The following example shows how to open bookmark dialog in Document Editor.

## Online Demo

Explore how to insert and manage bookmarks in Word documents using the ASP.NET Core Document Editor in this live demo [here](https://document.syncfusion.com/demos/docx-editor/asp-net-core/documenteditor/hyperlinksandbookmarks#/tailwind3).
Explore how to insert and manage bookmarks in Word documents using the ASP.NET Core DOCX Editor in this live demo [here](https://document.syncfusion.com/demos/docx-editor/asp-net-core/documenteditor/hyperlinksandbookmarks#/tailwind3).

## See Also

Expand Down
15 changes: 7 additions & 8 deletions Document-Processing/Word/Word-Processor/asp-net-core/chart.md
Original file line number Diff line number Diff line change
@@ -1,17 +1,17 @@
---
layout: post
title: Chart in Document Editor Component | Syncfusion
description: Learn here all about chart in Syncfusion Document Editor component of Syncfusion Essential JS 2 and more.
title: Chart in DOCX Editor Component | Syncfusion
description: Learn here all about charts in the Syncfusion DOCX Editor component of Syncfusion Essential JS 2 and more.
platform: document-processing
control: Chart
documentation: ug
---

# Chart in ASP.NET Core DOCX Editor Component

# Chart in Document Editor Component

[ASP.NET Core DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/asp-net-core-docx-editor) (Document Editor) provides chart preservation support. Using Document Editor, you can see the chart reports from your Word document.
[ASP.NET Core DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/asp-net-core-docx-editor) (Document Editor) provides chart preservation support. Using DOCX Editor, you can view charts from your Word document.

The following example shows chart preservation in the DOCX Editor.

{% tabs %}
{% highlight cshtml tabtitle="CSHTML" %}
Expand All @@ -22,10 +22,9 @@ documentation: ug
{% endhighlight %}
{% endtabs %}


## Supported Chart Types

The following chart types are supported in document editor
The following chart types are supported in the DOCX Editor:
* Scatter_Markers
* Bubble
* Area
Expand All @@ -48,4 +47,4 @@ The following chart types are supported in document editor

## Online Demo

Explore how to preserve charts in Word documents using the ASP.NET Core Document Editor in this live demo [here](https://document.syncfusion.com/demos/docx-editor/asp-net-core/documenteditor/chart#/tailwind3).
Explore how to preserve charts in Word documents using the ASP.NET Core DOCX Editor in this [live demo](https://document.syncfusion.com/demos/docx-editor/asp-net-core/documenteditor/chart#/tailwind3).
65 changes: 42 additions & 23 deletions Document-Processing/Word/Word-Processor/asp-net-core/clipboard.md
Original file line number Diff line number Diff line change
@@ -1,44 +1,47 @@
---
layout: post
title: Clipboard in Document Editor Component | Syncfusion
description: Learn here all about clipboard in Syncfusion Document Editor component of Syncfusion Essential JS 2 and more.
title: Clipboard in DOCX Editor Component | Syncfusion
description: Learn here all about clipboard in Syncfusion DOCX Editor component of Syncfusion Essential JS 2 and more.
platform: document-processing
control: Clipboard
documentation: ug
---


# Clipboard in Document Editor Component
# Clipboard in ASP.NET Core DOCX Editor Component

[ASP.NET Core DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/asp-net-core-docx-editor) (Document Editor) takes advantage of system clipboard and allows to copy or move a portion of the document into it in HTML format, so that it can be pasted in any application that supports clipboard.
[ASP.NET Core DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/asp-net-core-docx-editor) (Document Editor) takes advantage of the system clipboard and allows you to copy or move a portion of the document into it in HTML format, so that it can be pasted in any application that supports clipboard.

## Copy

Copy a portion of document to system clipboard using built-in context menu of document editor. You can also do it programmatically using the following sample code.
Copy a portion of the document to the system clipboard using the built-in context menu of the DOCX Editor. You can also do it programmatically using the following sample code.

```typescript
documentEditor.selection.copy();
container.documentEditor.selection.copy();
```

## Cut

Cut a portion of document to system clipboard using built-in context menu of document editor. You can also do it programmatically using the following sample code.
Cut a portion of the document to the system clipboard using the built-in context menu of the DOCX Editor. You can also do it programmatically using the following sample code.

```typescript
documentEditor.editor.cut();
container.documentEditor.editor.cut();
```

## Paste

Due to limitations, you can paste contents from system clipboard as plain text in document editor only using the ‘CTRL + V’ keyboard shortcut.
Due to limitations, you can paste content from the system clipboard as plain text in the DOCX Editor only using the "Ctrl + V" keyboard shortcut.

N> Due to browser limitations of getting content from the system clipboard, paste using the API and context menu options doesn't work.

## Local paste

Document editor exposes API to enable local paste within the control. On enabling this, the following is performed:
The DOCX Editor exposes an API to enable local paste within the control. On enabling this, the following is performed:

* Selected contents will be stored to an internal clipboard in addition to system clipboard.
* Selected contents will be stored to an internal clipboard in addition to the system clipboard.
* Clipboard paste will be overridden, and internally stored data that has formatted text will be pasted.

The following example shows how to enable local paste in the DOCX Editor.

{% tabs %}
{% highlight cshtml tabtitle="CSHTML" %}
Expand All @@ -50,38 +53,54 @@ Document editor exposes API to enable local paste within the control. On enablin
{% endtabs %}


By default, **enableLocalPaste** is false. When local paste is enabled for a document editor instance, you can paste contents programmatically if the internal clipboard has stored data during last copy operation.
By default, **enableLocalPaste** is false. When local paste is enabled for a DOCX Editor instance, you can paste content programmatically if the internal clipboard has stored data during the last copy operation.


```typescript
documentEditor.editor.pasteLocal();
container.documentEditor.editor.pasteLocal();
```

### EnableLocalPaste behavior

|**EnableLocalPaste** |**Paste behavior details**|
|--------------------------|----------------------|
|True |Allows to paste content that is copied from the same Document editor component alone and prevents pasting content from system clipboard. Hence the content copied from outside Document editor component can’t be pasted.<br>Browser limitation of pasting from system clipboard using API and context menu options, will be resolved. So, you can copy and paste content within the Document editor component using API and context menu options too.|
|False|Allows to paste content from system clipboard. Hence the content copied from both the Document editor component and outside can be pasted.<br>Browser limitation of pasting from system clipboard using API and context menu options, will remain as a limitation.|
|True |Allows pasting content that is copied from the same DOCX Editor component alone and prevents pasting content from the system clipboard. Hence, content copied from outside the DOCX Editor component cannot be pasted.<br>The browser limitation of pasting from the system clipboard using API and context menu options will be resolved. So, you can copy and paste content within the DOCX Editor component using API and context menu options too.|
|False|Allows pasting content from the system clipboard. Hence, content copied from both the DOCX Editor component and outside can be pasted.<br>The browser limitation of pasting from the system clipboard using API and context menu options will remain.|


N> Keyboard shortcut for pasting will work properly in both cases. Copying content from Document editor component and pasting outside will work properly in both cases.
N>
* Keyboard shortcut for pasting will work properly in both cases.
* Copying content from the DOCX Editor component and pasting outside will work properly in both cases.

### Paste options in context menu

In the DOCX Editor, paste options in the context menu will be in a disabled state if you try to copy/paste content from outside of the DOCX Editor. It gets enabled when `enableLocalPaste` is `true` and you copy/paste content within the DOCX Editor.

N> Due to browser limitations of getting content from the system clipboard, paste using the API and context menu options doesn't work. Hence, the paste option is disabled in the context menu.

Alternatively, you can use the keyboard shortcuts:

* Cut: Ctrl + X
* Copy: Ctrl + C
* Paste: Ctrl + V

## Paste with formatting

Document Editor provides support to paste the system clipboard data with formatting. To enable clipboard paste with formatting options, set the `EnableLocalPaste` property in Document Editor to false and use this .NET Standard library [`Syncfusion.EJ2.WordEditor.AspNet.Core`](<https://www.nuget.org/packages/Syncfusion.EJ2.WordEditor.AspNet.Core/>) by the web API service implementation. This library helps to paste the system clipboard data with formatting.
The DOCX Editor provides support to paste the system clipboard data with formatting. To enable clipboard paste with formatting options, set the `enableLocalPaste` property in the DOCX Editor to `false` and use the `Syncfusion.EJ2.WordEditor.AspNet.Core` .NET Standard library for the ASP.NET Core web API service implementation. This library helps you to paste the system clipboard data with formatting.

You can paste your system clipboard data in the following ways:

* **Keep Source Formatting** This option retains the character styles and direct formatting applied to the copied text. Direct formatting includes characteristics such as font size, italics, or other formatting that is not included in the paragraph style.
* **Match Destination Formatting** This option discards most of the formatting applied directly to the copied text, but it retains the formatting applied for emphasis, such as bold and italic when it is applied to only a portion of the selection. The text takes on the style characteristics of the paragraph where it is pasted. The text also takes on any direct formatting or character style properties of text that immediately precedes the cursor when the text is pasted.
* **Text Only** This option discards all formatting and non-text elements such as pictures or tables. The text takes on the style characteristics of the paragraph where it is pasted and takes on any direct formatting or character style properties of text that immediately precedes the cursor when the text is pasted. Graphical elements are discarded and tables are converted to a series of paragraphs.
* **Keep Source Formatting:** This option retains the character styles and direct formatting applied to the copied text. Direct formatting includes characteristics such as font size, italics, or other formatting that is not included in the paragraph style.
* **Match Destination Formatting:** This option discards most of the formatting applied directly to the copied text, but it retains the formatting applied for emphasis, such as bold and italic when it is applied to only a portion of the selection. The text takes on the style characteristics of the paragraph where it is pasted. The text also takes on any direct formatting or character style properties of text that immediately precedes the cursor when the text is pasted.
* **Text Only:** This option discards all formatting and non-text elements such as pictures or tables. The text takes on the style characteristics of the paragraph where it is pasted and takes on any direct formatting or character style properties of text that immediately precedes the cursor when the text is pasted. Graphical elements are discarded, and tables are converted to a series of paragraphs.

This paste option appears as follows.

![Image](images/paste.png)
![Paste options](images/paste.png)

N> When you paste content from an external source into the Document Editor, some formatting or elements may not appear as expected because certain elements are not supported. Refer [here](./unsupported-features) to learn more about unsupported elements.
N> When you paste content from an external source into the DOCX Editor, some formatting or elements may not appear as expected because certain elements are not supported. Refer [here](./unsupported-features) to learn more about unsupported elements.

## See Also

* [Keyboard shortcuts](../asp-net-core/keyboard-shortcut)
* [Feature modules](../asp-net-core/feature-module)
* [Keyboard shortcuts](../asp-net-core/keyboard-shortcut#clipboard)
Loading