wix-incubator / react-native-zss-rich-text-editor

React Native rich text editor based on ZSSRichTextEditor
Other
839 stars 310 forks source link

can't make insert link work... #7

Open cinder92 opened 7 years ago

cinder92 commented 7 years ago

Allways that i want to insert a link in the selected text, is not showing nothing after the popups out, i just alert the htmlContent from the richtext and there is no <a> tag.

mikaelrosquist commented 6 years ago

If anyone else is having trouble making insert link work with a custom toolbar. Calling prepareInsert() before showLinkDialog() on the editor should do it.

So the callback for your link button's onPress should look something like this:

this.editor.prepareInsert();
this.editor.showLinkDialog();
ohasy commented 6 years ago

Hi, it seems the this.editor.insertLink seems to be broken. heres a work around :)

                        <RichTextEditor
                            bounces={false}
                            hiddenTitle={true}
                            ref={(r) => {
                                this.richtext = r

                                }}
                            getEditor={() => this.richtext}
                            enableOnChange={ true }
                            autoCorrect={false}
                            // initialTitleHTML={'Title!!'}
                            style={{marginTop:12,borderColor: 'gray', borderWidth: 1,}}
                            initialContentHTML={this.state.msg_text} 
                            editorInitializedCallback={() => this.onEditorInitialized()} //register the callback 
                        />

inside your main component make a method

  onEditorInitialized = ()=>{
    this.richtext.registerToolbar((VAL)=>this.onContentFormatChanged(VAL))
    this.richtext.registerContentChangeListener((val)=>this.onContentChanged(val)) //this one
  }

            let text = this.state.msg_text;
            console.log("state msg_Text",this.state.msg_text)
            text += `<a href="${this.props.server_url+response.data.msg.original.document_file}">${response.data.msg.original.document_title}</a>`
            this.setState({msg_text:text,loaderFileUpload:false},()=>{
                console.log("state",this.state.msg_text)
            })

//till this point the state is succesfully updated with link code. //to refresh the Rich text - I wrapped in a modal . and hide and shown the modal real quick //it seems to work //let me know if you can do it with out next following code

            //this is just a jugad to update the text input in text editor
            this.setState({showLoader:true},()=>{
                this.setState({showLoader:false})
            })
akshit5230 commented 4 years ago

Hi. For me when i insert link it gets added to the content but not displayed in the editor. Any idea what could be the issue? Same happening with image. I see the tag in content but nothing displayed in the editor. I'm using iOS 13.3 simulator