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
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
layout: post
title: Get current word in Vue Document editor component | Syncfusion
description: Learn here all about Get current word in Syncfusion Vue Document editor component of Syncfusion Essential JS 2 and more.
control: Get current word
control: Get current word
platform: document-processing
documentation: ug
domainurl: ##DomainURL##
Expand Down Expand Up @@ -48,9 +48,9 @@ const onCreated = function () {
container.value.ej2Instances.documentEditor.selection.selectCurrentWord();

// To get the selected content as text
var selectedContentText = this.$refs.container.ej2Instances.documentEditor.selection.text;
var selectedContentText = container.value.ej2Instances.documentEditor.selection.text;
// To get the selected content as SFDT (rich text)
var selectedContentSFDT = this.$refs.container.ej2Instances.documentEditor.selection.sfdt;
var selectedContentSFDT = container.value.ej2Instances.documentEditor.selection.sfdt;
}
</script>

Expand Down Expand Up @@ -103,13 +103,13 @@ export default {
{% endhighlight %}
{% endtabs %}

> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
N> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.

To get the bookmark content as SFDT (rich text), please check this [`link`](../how-to/get-the-selected-content#get-the-selected-content-as-sfdt-rich-text)
To get the bookmark content as SFDT (rich text), check this [`link`](../how-to/get-the-selected-content#get-the-selected-content-as-sfdt-rich-text)

## Select and get the paragraph in current cursor position

You can use [`selectParagraph`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/selection#selectparagraph) API in selection module to select the current paragraph at cursor position and use [`text`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/selection#text-code-classlanguage-textstringcode) API or [`sfdt`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/selection#sfdt-code-classlanguage-textstringcode) API to get the selected content as plain text or SFDT from Vue Document Editor component.
You can use [`selectParagraph`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/selection#selectparagraph) API in selection module to select the current paragraph at cursor position and use the [`text`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/selection#text-code-classlanguage-textstringcode) API or [`sfdt`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/selection#sfdt-code-classlanguage-textstringcode) API to get the selected content as plain text or SFDT from Vue Document Editor component.

The following example code illustrates how to select and get the current paragraph as SFDT.

Expand Down Expand Up @@ -139,9 +139,9 @@ const onCreated = function () {
container.value.ej2Instances.documentEditor.selection.selectParagraph();

// To get the selected content as text
var selectedContentText = this.$refs.container.ej2Instances.documentEditor.selection.text;
var selectedContentText = container.value.ej2Instances.documentEditor.selection.text;
// To get the selected content as SFDT (rich text)
var selectedContentSFDT = this.$refs.container.ej2Instances.documentEditor.selection.sfdt;
var selectedContentSFDT = container.value.ej2Instances.documentEditor.selection.sfdt;
}
</script>

Expand Down Expand Up @@ -190,4 +190,4 @@ export default {
{% endhighlight %}
{% endtabs %}

> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
N> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ You can get the selected content from the [Vue DOCX Editor](https://www.syncfusi

You can use [`text`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/selection#text-code-classlanguage-textstringcode) API to get the selected content as plain text from Vue Document Editor component.

The following example code illustrates how to add search in google option in context menu for the selected text.
The following example code illustrates how to add Search in Google option in context menu for the selected text.

{% tabs %}
{% highlight html tabtitle="Composition API (~/src/App.vue)" %}
Expand Down Expand Up @@ -132,9 +132,9 @@ export default {
{% endhighlight %}
{% endtabs %}

> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
N> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.

You can add the following custom options using this API,
You can add the following custom options using this API:

* Save or export the selected text as text file.
* Search the selected text in Google or other search engines.
Expand Down Expand Up @@ -230,10 +230,10 @@ export default {
{% endhighlight %}
{% endtabs %}

> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
N> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.

You can add the following custom options using this API,
You can add the following custom options using this API:

* Save or export the selected content as SFDT file.
* Get the content of a bookmark in Word document as SFDT by selecting a bookmark using [`selectbookmark`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/selection#selectbookmark) API.
* Get the content of a bookmark in Word document as SFDT by selecting a bookmark using [`selectBookmark`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/selection#selectbookmark) API.
* Create template content that can be inserted to multiple documents in cursor position using [`paste`](https://ej2.syncfusion.com/vue/documentation/api/document-editor/editor#paste) API.
Original file line number Diff line number Diff line change
@@ -1,22 +1,22 @@
---
layout: post
title: Hide tool bar and properties pane in Vue Document editor component | Syncfusion
title: Hide Toolbar and Properties Pane in Vue DOCX Editor | Syncfusion
description: Learn here all about Hide tool bar and properties pane in Syncfusion Vue Document editor component of Syncfusion Essential JS 2 and more.
control: Hide tool bar and properties pane
platform: document-processing
documentation: ug
domainurl: ##DomainURL##
---

# Hide tool bar and properties pane in Vue Document editor component
# How to Hide Toolbar and Properties Pane in Vue DOCX Editor

**Document editor container** provides the main document view area along with the built-in toolbar and properties pane.
**Document Editor Container** provides the main document view area along with the built-in toolbar and properties pane.

**[Vue DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/vue-docx-editor) (Document Editor)** provides just the main document view area. Here, the user can compose, view, and edit the Word documents. You may prefer to use this component when you want to design your own UI options for your application.

## Hide the properties pane

By default, Document editor container has built-in properties pane which contains options for formatting text, table, image and header and footer. You can use [`showPropertiesPane`](https://ej2.syncfusion.com/vue/documentation/api/document-editor-container/documentEditorContainerModel#showpropertiespane) API in [`DocumentEditorContainer`](https://ej2.syncfusion.com/vue/documentation/api/document-editor-container/documentEditorContainerModel/) to hide the properties pane.
By default, Document Editor Container has built-in properties pane which contains options for formatting text, tables, images, headers, and footers. You can use [`showPropertiesPane`](https://ej2.syncfusion.com/vue/documentation/api/document-editor-container/documentEditorContainerModel#showpropertiespane) API in [`DocumentEditorContainer`](https://ej2.syncfusion.com/vue/documentation/api/document-editor-container/documentEditorContainerModel) to hide the properties pane.

The following example code illustrates how to hide the properties pane.

Expand Down Expand Up @@ -72,13 +72,13 @@ export default {
{% endhighlight %}
{% endtabs %}

> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
N> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.

>Note: Positioning and customizing the properties pane in Document editor container is not possible. Instead, you can hide the exiting properties pane and create your own pane using public API's.
N> Positioning and customizing the properties pane in the Document Editor Container is not possible. Instead, you can hide the existing properties pane and create your own pane using public APIs.

## Hide the toolbar

You can use [`enableToolbar`](https://ej2.syncfusion.com/vue/documentation/api/document-editor-container/documentEditorContainerModel#enabletoolbar) API in [`DocumentEditorContainer`](https://ej2.syncfusion.com/vue/documentation/api/document-editor-container/documentEditorContainerModel/) to hide the existing toolbar.
You can use [`enableToolbar`](https://ej2.syncfusion.com/vue/documentation/api/document-editor-container/documentEditorContainerModel#enabletoolbar) API in [`DocumentEditorContainer`](https://ej2.syncfusion.com/vue/documentation/api/document-editor-container/documentEditorContainerModel) to hide the existing toolbar.

The following example code illustrates how to hide the existing toolbar.

Expand Down Expand Up @@ -134,7 +134,7 @@ export default {
{% endhighlight %}
{% endtabs %}

> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.
N> The Web API hosted link `https://document.syncfusion.com/web-services/docx-editor/api/documenteditor/` utilized in the Document Editor's serviceUrl property is intended solely for demonstration and evaluation purposes. For production deployment, please host your own web service with your required server configurations. You can refer and reuse the [GitHub Web Service example](https://github.com/SyncfusionExamples/EJ2-DocumentEditor-WebServices) or [Docker image](https://hub.docker.com/r/syncfusion/word-processor-server) for hosting your own web service and use for the serviceUrl property.

## See Also

Expand Down
Loading