Skip to content

1043283: UG Correction for React platform #3861

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
MoushmiDhanislas wants to merge 1 commit into
base: development
Choose a base branch
from
+22 −19
Open

1043283: UG Correction for React platform #3861

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
20 changes: 10 additions & 10 deletions ...Word/Word-Processor/react/how-to/deploy-document-editor-component-for-mobile.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,22 +1,22 @@
---
layout: post
title: Deploy mobile document editor in React | Syncfusion
description: Learn here all about Deploy document editor component for mobile in Syncfusion React Document editor component of Syncfusion Essential JS 2 and more.
control: Deploy document editor component for mobile
title: Deploy mobile DOCX Editor in React | Syncfusion
description: Learn here all about Deploy Document Editor component for mobile in Syncfusion React Document Editor component of Syncfusion Essential JS 2 and more.
control: Deploy Document Editor component for mobile
platform: document-processing
documentation: ug
domainurl: ##DomainURL##
---

# Deploy document editor component for mobile in React Document editor component
# Deploy Document Editor component for mobile in React Document Editor component

## Document editor component for Mobile
## Document Editor component for mobile

At present, [React DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/react-docx-editor) (Document Editor) component is not responsive for mobile, and we haven't ensured the editing functionalities in mobile browsers. Whereas it works properly as a document viewer in mobile browsers.
At present, [React Document Editor](https://www.syncfusion.com/docx-editor/sdk/react-docx-editor) (Document Editor) component is not responsive for mobile, and editing functionalities are not supported in mobile browsers. However, it works properly as a document viewer in mobile browsers.

Hence, it is recommended to switch the Document editor component as read-only in mobile browsers. Also, invoke [`fitPage`](https://ej2.syncfusion.com/react/documentation/api/document-editor#fitpage/) method with `FitPageWidth` parameter in document change event, such as to display one full page by adjusting the zoom factor.
Hence, it is recommended to switch the Document Editor component to read-only in mobile browsers. Also, invoke the [`fitPage`](https://ej2.syncfusion.com/react/documentation/api/document-editor#fitpage/) method with `FitPageWidth` parameter in the document change event to display one full page by adjusting the zoom factor.

The following example code illustrates how to deploy Document Editor component for Mobile.
The following example code illustrates how to deploy the Document Editor component for mobile.

{% raw %}

Expand Down Expand Up @@ -74,8 +74,8 @@ ReactDOM.render(<App />, document.getElementById('sample'));
```
{% endraw %}

> 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 download the complete working example from this [GitHub location](https://github.com/SyncfusionExamples/Deploy-Document-Editor-in-Mobile-Friendly-Web-page/)

>Note: You can use the [`restrictEditing`](https://ej2.syncfusion.com/react/documentation/api/document-editor-container#restrictediting) in DocumentEditorContainer and [`isReadOnly`](https://ej2.syncfusion.com/react/documentation/api/document-editor#isreadonly) in DocumentEditor based on your requirement to change component to read only mode.
N> You can use the [`restrictEditing`](https://ej2.syncfusion.com/react/documentation/api/document-editor-container#restrictediting) in DocumentEditorContainer and [`isReadOnly`](https://ej2.syncfusion.com/react/documentation/api/document-editor#isreadonly) in DocumentEditor based on your requirement to change the component to read-only mode.
21 changes: 12 additions & 9 deletions Document-Processing/Word/Word-Processor/react/how-to/disable-auto-focus.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,28 +1,31 @@
---
layout: post
title: How to disable auto focus in React DocumentEditor control | Syncfusion
description: Learn here all about How to disable and enable auto focus in Syncfusion React Document editor component of Syncfusion Essential JS 2 and more.
title: How to disable auto focus in React DOCX Editor | Syncfusion
description: Learn here all about How to disable and enable auto focus in Syncfusion React Document Editor component of Syncfusion Essential JS 2 and more.
platform: document-processing
control: How to disable auto focus in document editor
control: How to disable auto focus in Document Editor
documentation: ug
domainurl: ##DomainURL##
---

# How to disable auto focus in Syncfusion<sup style="font-size:70%">&reg;</sup> React Document Editor component
# How to disable auto focus in React Document Editor component

[React DOCX Editor](https://www.syncfusion.com/docx-editor-sdk/react-docx-editor) (Document Editor) gets focused automatically when the page loads. If you want the Document editor not to be focused automatically it can be customized.
[React Document Editor](https://www.syncfusion.com/docx-editor-sdk/react-docx-editor) (Document Editor) gets focused automatically when the page loads. If you do not want the Document Editor to be focused automatically, you can customize this behavior.

The following example illustrates to disable the auto focus in DocumentEditorContainer.
The following example illustrates how to disable the auto focus in DocumentEditorContainer.

```typescript
<DocumentEditorContainerComponent id="container" height={'590px'} enableAutoFocus={false} />
```

>Note: Default value of [`enableAutoFocus`](https://ej2.syncfusion.com/react/documentation/api/document-editor-container#enableautofocus) property is `true`.
The following example illustrates to disable the auto focus in DocumentEditor.
N> The default value of [`enableAutoFocus`](https://ej2.syncfusion.com/react/documentation/api/document-editor-container#enableautofocus) property is `true`.

## Disable auto focus in DocumentEditor

The following example illustrates how to disable the auto focus in DocumentEditor.

```typescript
<DocumentEditorComponent id="container" height={'590px'} enableAutoFocus={false}/>
```

>Note: Default value of [`enableAutoFocus`](https://ej2.syncfusion.com/react/documentation/api/document-editor#enableautofocus) property is `true`.
N> The default value of [`enableAutoFocus`](https://ej2.syncfusion.com/react/documentation/api/document-editor#enableautofocus) property is `true`.