React - redux-form initialValues with draftjs

Viewed 1812

I am trying to use draft-js for Rich Text Editor in my app, with redux-form, the problem I am facing is I am not able to populate initialValues into the Editor from draft-js, my code looks like this

<form onSubmit={handleSubmit(this.onFormSubmit.bind(this))}>

  <Field
    name="websiteurl"
    placeholder="INSERT WEBSITE URL HERE"
    component={this.renderFieldText}
    mandatory='true'
  />

  <Field
    name="htmlcontent"
    placeholder="ENTER HTML CONTENT HERE"
    component={this.renderRichTextEditor}
  />
  <Button bsStyle="primary" type="submit" className="pull-right" loading={this.state.loading}>Save</Button>

</form>


renderRichTextEditor(field){
   return (
      <RichTextEditor placeholder={field.placeholder}/>
   );
}

renderFieldText(field){
      var divClassName=`form-group ${(field.meta.touched && field.meta.error)?'has-danger':''}`;
      divClassName = `${divClassName} ${field.bsClass}`;
      return(
        <div className={divClassName}>
        <input
        className="form-control"
        type={field.type}
        placeholder={field.placeholder}
        {...field.input}
        />
        </div>
      );
    }

I have two fields websiteurl and htmlcontent, the component websiteurl gets populated with initialValues, but I am not getting how to do this with draft-js Editor which is implemented inside RichTextEditor component..

If anyone has achieved something like this, please help.

Thanks.

1 Answers
Related