How to send data to summernote editor?


#1

how to send data to summernote editor ?

Template.priceForm.helpers({
  option() {
    const exist = Collections.Options.findOne({ key: 'price' });
    return exist ? exist.body : '';
  },
})

and in html:
<div id="editor" name="body">{{{ option }}}</div>

so this not send content to editor


#2

In your html, just put
<div id="editor" name="body"></div>
and in your template add

Template.priceForm.created = function(){
  var exist = Collections.Options.findOne({ key: 'price' });
  this.value = new ReactiveVar(exist ? exist.body : '');
};
Template.priceForm.rendered = function(){
      var self = this;
      $('#editor').summernote({
          minHeight: 200,  // put correct value here 
          maxHeight: 800, // put correct value here
          width: 820, // put correct value here
          onInit: function() {
            console.log("init");
            $('#editor').code(self.value.get());
          },
          onChange: function(contents, $editable) {
            console.log('onChange:', contents, $editable);
            // if you wanna do something here
          }
      });

  Deps.autorun(function(){
    // update reactive var value
    var exist = Collections.Options.findOne({ key: 'price' });
    self.value.set(exist ? exist.body : '');
    // refresh editor with new value
    $('#editor').code(self.value.get());
  });
};

#3

FYI after deep integration and effort with summernote, I switched to froala:editor-reactive, if you do you would get something like

<div>
        {{> froalaReactive
            _value=option
           inlineMode=false
           placeholder=""
           paragraphy=false
        }}
</div>

and you keep your helper :
> Template.priceForm.helpers({
> option() {
> const exist = Collections.Options.findOne({ key: ‘price’ });
> return exist ? exist.body : ‘’;
> },
> })

Much more simplier :wink: Froala is very good for customization of buttons, blockstyles, event handling. Imho, for sure you save 20x the license price in productivity, you’ll have to pay when your app is on production.


Rich text editors?
#4

@lyquocnam does it help ?


#5

thanks so much @lc3t35 this really cool help. Froala is good, but premium and 99$/domain awesome :smiley: