Create and Edit Template into Database

[kamleshkatpara]

This is my code to Create a new template and insert the inline html with style into the database :

       var editor = grapesjs.init
           ({
              height: '100%',
              container : '#gjs',
              plugins: ['gjs-preset-newsletter'],
          storageManager: {
              id:'',
              type: 'remote',
              autosave: false,
              urlStore: '<?php base_url(); ?>/dragdropeditor/dragdrop/add',
              contentTypeJson: true,
              },
          });

          editor.Panels.addButton('options', [{
               id: 'save',
                    className: 'fa fa-floppy-o icon-blank',
                    command: function (editor, sender) {
                        if (sender)
                            sender.set('active', 0);
                          var html = editor.runCommand('gjs-get-inlined-html');
                          var storageManager = editor.StorageManager;
                          storageManager.store({"template-data":html})
                         // editor.store();
                          alert('Draft');

                        editor.on('storage:store', function (e) {
                          
                            console.log('CompleteHTML: ', html);
                        });
                    },

                    attributes: {title: 'Save Template'}
                }]);        

I am able to insert the template-data into database in this manner :

created_at	id	template-name	template-data
2017-10-05 12:13:09	3	first	Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua

My edit template code :

var id = '<?php echo $this->uri->segment('3'); ?>';

     var editor = grapesjs.init
           ({
             height: '100%',
              container : '#gjs',
              plugins: ['gjs-preset-newsletter'],
          storageManager: {
              type: 'remote',
              autosave: false,
              urlStore: '<?php echo base_url(); ?>dragdropeditor/dragdrop/add',
              urlLoad: '<?php echo base_url(); ?>dragdropeditor/dragdrop/fetch/'+id,
              contentTypeJson: true,
              },
          });

          editor.Panels.addButton
          ('options',
            [{
              id: 'save-db',
              className: 'fa fa-floppy-o',
              command: 'save-db',
              attributes: {title: 'Draft'}
            }]
          );

        editor.Commands.add
        ('save-db',
        {
            run: function(editor, sender)
            {
              sender && sender.set('active'); // turn off the button
              editor.store();
              alert('Draft');    
            }
        });

Wonder why its not loading it into urlLoad

@artf @sonnylloyd

[arthuralmeidap]

@mekamleshk you can debug with the Developer Tools. Open the developer tools and run the grapesjs and see if the XHR is happening and what is the body of the response

[artf]

@mekamleshk first of all, learn how to post your code on GitHub please
https://guides.github.com/features/mastering-markdown/
I'm wasting my time just by reading/fixing them

[kamleshkatpara]

@artf I have updated my code.
I am sending and retrieving the template data like this :

                     `var html = editor.runCommand('gjs-get-inlined-html');
                      var storageManager = editor.StorageManager;
                      storageManager.store({"template-data":html})`

I am able to store it into database but while editing the template urlLoad does not take that format which I had sent while saving it into database

[artf]

just load it manually then