Questions tagged [draftjs]

Draft.js is a framework for building rich text editors in React, powered by an immutable model and abstracting over cross-browser differences.

Draft.js is a framework for building rich text editors in React, powered by an immutable model and abstracting over cross-browser differences.

Draft.js makes it easy to build any type of rich text input, whether you're just looking to support a few inline text styles or building a complex text editor for composing long-form articles.

In Draft.js, everything is customizable – it provides the building blocks so that you have full control over the user interface.

You can learn more about Draft.js here.

746 questions
0
votes
1 answer

In draft-js using the staticToolBarPlugin, why does changing styles for selected text move text to new line?

So I will start out with this: Solar Power And then I bold, say, Solar, and I get this: Solar Power Why does it go into a new line?
faceyspacey.com
  • 2,510
  • 2
  • 20
  • 29
0
votes
1 answer

Draft.js insert image at dropped position

I'm trying to drop image from outside of draft-js editor but it's always inserted at last position of the cursor/selection in editor (or at end if cursor/selection not set). This is my wrap around draft-js-drag-n-drop-plugin const…
zhuber
  • 5,364
  • 3
  • 30
  • 63
0
votes
1 answer

How do I assign Json to Editor in drafjs?

I am getting json object in which I want to assign text to draftjs editor but when I try to assign it it throw error "PageContainer.js:165 Uncaught TypeError: draft_js__WEBPACK_IMPORTED_MODULE_1__.EditorState.createFromText is not a…
Shareque
  • 129
  • 1
  • 9
0
votes
2 answers

this.props.editorState.isInCompositionMode is not a function error in Draft.js of react

My objective is to initialize Draft.js editor with the HTML which is retrieved from DB. Whenever I try to initialize editor, its throwing an error: this.props.editorState.isInCompositionMode is not a function For converting Draft.js contents into…
Rohit Sawai
  • 739
  • 1
  • 11
  • 28
0
votes
1 answer

How to move the cursor to the end of the line?

I am using draft.js to develop a Rich text editor. I want the user to be able to keep typing once the Italic button is clicked. And inline styling should be applied until the user disable the italic button. Clicking on the button make the cursor to…
It worked yesterday.
  • 4,507
  • 11
  • 46
  • 81
0
votes
1 answer

onChange not triggering when the draft editor is in readOnly mode

onChange event not triggering when the draft editor is in the readOnly mode. I wanna keep the readOnly mode, but it has to trigger the onChange event, so that I can save my work.
satheesh
  • 403
  • 5
  • 15
0
votes
0 answers

Replace the selected text and add a link in draft js

I know how to add a link to the selected text but I need to replace the selected text value and add a hyperlink to it in draft js eg If i have written " Go to Google " in the editor of draft js and if I select Google and want to replace Google with…
Nidhi
  • 57
  • 1
  • 5
0
votes
1 answer

Draft.js how to represent list of items?

In order to create image carousel, I thought creating nested blocks as following image_carousels image image image Then I found draft.js doesn't support nested blocks. (https://github.com/facebook/draft-js/issues/143 they say draft.js is flat)…
eugene
  • 39,839
  • 68
  • 255
  • 489
0
votes
1 answer

React Draft Wysiwyg apply bold, italic or udenderlina to whole content

I need to apply the Bold, Italic, Underline style to the whole content of editor, without selected text, like the align styles but I couldn't find the way for that. Is the possible to change the action or handler?
0
votes
1 answer

How to use replaceWithFragment in draft-js?

I need to replace "prefix" what user type for autocomplete text. In docs I found that, but I really don't know how to use this. replaceWithFragment( contentState: ContentState, targetRange: SelectionState, fragment: BlockMap ):…
0
votes
2 answers

Draft.js insert one contentState into another

I have a Draft.js editor with some HTML in it. How can I insert a new piece of HTML at a current selection position, preserving both stylings and entity/block mappings? I know how to insert raw text via Modifier.insertText: const contentState =…
0
votes
2 answers

How do I submit values from the text box as an HTML string?

I am using the library react-draft-wysiwyg, and I would like the inputted values from the text box to be in the form of an HTML string. Currently, the inputted values that I log in the console appear in a format I can't submit to my backend, as it's…
0
votes
1 answer

Draft-js better way to save and retrive content form MySql

I use draft-js with some plugins as editor in a reactjs app. I'm looking for a good way to store data on db and retrieve that data. I think that the better solutions is to save data in two different format: the serialized raw json to eventually…
red
  • 1,529
  • 1
  • 12
  • 33
0
votes
1 answer

Create a new entity from selection in draft.js / /Draftail, wrap existing text and link entities

I'm trying to create a new entity for Wagtail's Draftail text editor (based on draft.js). I've started off with the example here: http://docs.wagtail.io/en/v2.5.1/advanced_topics/customisation/extending_draftail.html#creating-new-entities I have the…
urlsangel
  • 41
  • 4
0
votes
1 answer

How to convert the draft.js output to plain html code using draft-js-html

I need to have around 6 text-editors for different fields so that the user can modify the text as bold, italic, underline, add images to it.I need to send the data as a plain HTML to db and receive data in the same format.I'm using…
Pavan Kusunuri
  • 327
  • 5
  • 20