Issue #778💬 AnsweredOpened January 18, 2018by ghena0 reactions

Save to db data-gjs-droppable

快速解答by artf

@ghena you should store HTML/CSS for the final result, for the editor you have to rely on JSON format I think it would be better for you using the built-in remote storage instead of a custom one Check also #597

Read full answer below ↓

Question

Hi guys,

I need to solve a problem. Saving html grapejs strip all data-gjs-* from html. Exists a way to maintain all data-gjs-* before save editor html ?

代码片段TEXT
Infact if i save my template all data-gjs-droppable is missing and in a next render it doens load data-gjs-droppable attributes and son on.

I save in this way:

     editor.Commands.add
        ('save-db',
        {
            run: function(editor, sender)
            {

              //var html = editor.runCommand('gjs-get-inlined-html');
              var html = editor.getHtml();
             var css = editor.getCss();

              var customBlocks = $($.parseHTML(html)).find('.custom-block');
              var post_ids = [];
              var params =  {css:css,html: html,post_id:<?php echo $_post->ID ?>};

              jQuery.ajax(
                        {url: '<?php echo $pathHttpGrapes ?>/scripts/save.php',
                        type: 'POST',
                        data: params,
                        dataType: "json",
                        crossDomain: false,
                        success: function(result){
                        },
                        error:function(){
                            toastr.error("Si è generato un errore inatteso");
                        }
               });
              sender && sender.set('active'); // turn off the button
                         }
        });

thanks in advance.
regards.

Answers (3)

artfJanuary 19, 2018

@ghena you should store HTML/CSS for the final result, for the editor you have to rely on JSON format

const comps = editor.getComponents();
const style = editor. getStyle();

I think it would be better for you using the built-in remote storage instead of a custom one

grapesjs.init({
...
storageManager: {
            type: 'remote',
            stepsBeforeSave: 10,
            contentTypeJson: true,
            urlStore: "<?php echo $pathHttpGrapes ?>/scripts/save.php",
			// You don't need this if you already init the editor with a template
			// autoload:  true,
            // urlLoad: "/load-template/2", 
            params: {
				post_id: <?php echo $_post->ID ?>
			},
          },
})

Check also #597

shareefhiasatJune 19, 2018

@artf how to save with remote end point with inlined html mode , i mean html and css into html sent to server ? thanks

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Free option

Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.

Browse free plugins →
Premium option

Premium plugins ship with support, regular updates, and production-ready features — save days of integration work.

Browse premium plugins →

Related tutorials

In-depth guides on the same topic.

All tutorials →

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.