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

How does one set the tabIndex attribute on a draft-js instance?

How does one pass a tabIndex value to the draft-js editor so it can participate in the "tab-between-components" cycle?
SteveB
  • 851
  • 2
  • 7
  • 15
0
votes
0 answers

Replace word in Draft.js from plain Javascript

I'm building a Chrome extension that corrects the users' typings. Upon correction, the corrected word is changed in the input field. The code currently works on textareas, and contenteditables, but I'm facing issues with Draft.js, like Facebook's…
Mihaly KR
  • 2,363
  • 2
  • 19
  • 20
0
votes
1 answer

Get the text typed from a user in draftjs

I have a form on my react app. I want to capture the input from the form from my users and store the text in a state property and then send the text back to my server. I have followed the basic DraftJS tutorial however it gives me a map in my state,…
N P
  • 2,319
  • 7
  • 32
  • 54
0
votes
1 answer

What is the best solution for organize two (or more) editing areas inside custom component?

What is the best solution for organize two (or more) editing areas inside custom component? My goal is to create custom component, that works similar as Image Block from medium-draft http://bitwiser.in/medium-draft/ However, in my case should be two…
Mikhail Shabrikov
  • 8,453
  • 1
  • 28
  • 35
0
votes
2 answers

Draft.js: Change color of caret

I am using Facebook's Draft.js library to create a rich text box and I have a requirement to make the caret of the text box red. Is it possible? I have read about the -webkit-text-fill-color property but it is making the typed text and the…
Tarun Dugar
  • 8,921
  • 8
  • 42
  • 79
0
votes
0 answers

Why the editor Draft.js cuts from html pictures and how to undo it?

When I insert into the editor along with the html images, for example: import React, { PropTypes, Component } from 'react' import ReactDOM from 'react-dom' import {Editor, EditorState} from 'draft-js' var sampleMarkup = `

Hello

Bold…
alex10
  • 2,726
  • 3
  • 22
  • 35
0
votes
1 answer

React dynamically set custom tags

Rather than having to create a component per custom header type, I would like to do so dynamically. const HEADERS = { 'header-one': 'h1', 'header-two': 'h2', 'header-three': 'h3', 'header-four': 'h4', 'header-five': 'h5', }; _ let…
oCodaa
  • 173
  • 2
  • 3
  • 13
0
votes
2 answers

Draft.js editor lost focus on Android browser(s) after first word

I'm using Draft.js in a React.js project. The Editor works fine on desktop browser(s) (Chrome,Firefox, IE, Edge...) but I have problem in Android device. After I enter the first word in editor and press spacebar (on soft keyboard) the Editor lost…
Duc Nguyen
  • 31
  • 3
0
votes
1 answer

setState draft js from enter key

please help me. I have a code like this, but there is a problem at the time of changing the state, the message error is 'Uncaught Error: Got unexpected null or undefined (...)' var contentState, editorState, text; text =…
Tio Lampard
  • 1
  • 2
  • 4
0
votes
1 answer

Draft.js get selection or span for already styled elements

I'm using react-rte but am willing to extend it so let's talk about Draft-js. I need to be able to "inline-style" a selection. Then on subsequent renders re-access that selection's dom. So let's say I highlight a selection. Then I persist the…
Raif
  • 8,641
  • 13
  • 45
  • 56
0
votes
2 answers

Focus Editor, Position Cursor at Start of First Block

I need to apply focus to a Draft.js editor and position the cursor at the start of the first line/block. The editor contains multiple lines/blocks. With only this.refs.editor.focus() being applied, the cursor is always positioned at the start of the…
cantera
  • 24,479
  • 25
  • 95
  • 138
0
votes
0 answers

DraftJS with Internet Explorer

Rendering DraftJS Editor on IE11 gives the following error - Invariant Violation: PluginEditor.render(): A valid ReactComponent must be returned. You may have returned undefined, an array or some other invalid object. This same setup works fine in…
Robin Maben
  • 22,194
  • 16
  • 64
  • 99
0
votes
0 answers

Add a div to caret position in draft-js editor

I am using draftjs-editor-plugins. I want to get a functionality like this In short looking for something like this http://ichord.github.io/Caret.js/ in React. Or any workaround to integrate it with react?
kaushik94
  • 687
  • 6
  • 17
0
votes
4 answers

Syntax highlighting using React without JSX

I want to build a React form with a text field that has very simple syntax highlighting, but I'd like to do it without JSX. Is there a way to use DraftJS without JSX?
Don Kirkby
  • 53,582
  • 27
  • 205
  • 286
0
votes
1 answer

How to replace certain text/block present in DraftJS Editor with html?

I am using DraftJS Editor for having Rich Text features in my application's React based web page. I have the following requirement: When a user types in # key, a drop down is displayed besides Editor, from where user can choose an option. Depending…
Faisal Mq
  • 5,036
  • 4
  • 35
  • 39
1 2 3
49
50