Issue #2640Opened March 12, 2020by Ace06112 reactions

Adding extra attributes with Stylemanager to change selected block's attribute

Question

Thanks for this awesome plugin. I am integrating it with my current project. Have one issue with it. Here is my code, I have added a new sector with 3 input fields, I want to change the selected block's attribute(id, readOnly) with my value in those input fields. for instance: I want to change id of the selected block with my functionality. How can i achieve this?

editor.StyleManager.addSector( "mySector",

Code SnippetTEXT

{
      name: "Element Attributes",
      open: true,
      properties: [{ name: "id" }, { name: "name" }, { name: "readOnly" }]
      // buildProps: ['id', 'readOnly'],
    },
    { at: 0 }
  );

and to change the attribute of selected component:

editor.on("block:drag:stop", function(droppedComponent) {    
    droppedComponent.addAttributes({
      id: "customId"(it should take it from the input)
      // onclick: `jsFunc('#${randomId}')`
    });
  });

Answers (3)

pouyamiralayi• March 12, 20201 reactions

@Ace0611 you can use traits for both controlling props (id, title & etc) and attributes. Cheers!

pouyamiralayi• March 13, 20201 reactions

@Ace0611

Will using id by traits override that?

yes! id is just a regular prop like others. And notice that grapesjs already provides you with default traits for id & title. Cheers!

Ace0611• March 13, 20200 reactions

@pouyamiralayi : Thanks for helping me out. One doubt though, Every block that is being dragged, generates a dynamic id. Will using id by traits override that? My apologies, I am travelling right now, so cant do it myself at the moment. I will try it as soon as possible.

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...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.

Presets Plugins Components Blocks Assets Commands I18n Layers Styles Storages RTE Newsletters Web pages Site builders

Adding extra attributes with Stylemanager to change selected block's attribute

Question

Answers (3)

Related Questions and Answers

[QUESTIONS] change or add event on add component from block

Modifying a component in the editor clears the model content

How to reload block content based on trait value change

Adding / Updating href trait does not add `<a></a>` wrapper to image.

Paid Plugins That Match This Issue

Browse Plugin Categories