Is it me or is this a bug
Question
Hi, so I am using version 0.14.62 and I have a problem with the TraitManager. I have defined two custom traits like so:
//Traits manager
// Each new type extends the default Trait
editor.TraitManager.addType('bindingSrc', {
/*events: {
'keyup': 'onChange', // trigger parent onChange method on keyup
},*/
onValueChange: function () {
if(this.model.get('type')==="bindingSrc"){
//reference the targe element as a model
model = this.target;
//get the new value from the traits object
newValue = this.model.get('value');
//set the new value to the group-bindings field.
model.set('attributes', {'group-bindings': newValue});
//update the input controls angular bindings
model.find("input")[0].set('attributes', {"ng-model": newValue});
}
}
});
editor.TraitManager.addType('ctrlLabel', {
/*events: {
'keyup': 'onChange', // trigger parent onChange method on keyup
},*/
onValueChange: function () {
if(this.model.get('type')==="ctrlLabel"){
this.target.find('label')[0].set({content: this.model.get('value')});
}
}
});
And my component like so:
//Component: RadioButton
var radioButton = String.format('<div class="pretty p-default p-round radio-control" data-gjs-draggable=".control-group"><input type="radio" name="radio1" {0} disabled><div class="state" {0}><label {0}>Radio Control</label></div></div>', cBehaviors["component-inner-body"]);
domComps.addType('RadioControl', {
tagName: "div",
model: dModel.extend({
// Extend default properties
defaults: Object.assign({}, dModel.prototype.defaults, {
selectable: "true",
draggable: "ControlGroup",
traits: [{type: 'bindingSrc', label: 'Bind to', name: "group-bindings"}, {type: 'ctrlLabel', label: "Label", name: "control-label"}]
}),
}, {
isComponent: function (el) {
if (el.tagName == 'DIV' && el.classList.contains("radio-control")) {
return {
type: "RadioControl"
};
}
},
}),
view: dView,
});
The problem is that when I change the value for bindingSrc an event is fired for both bindingSrc and ctrlLabel. The end result is that the label is set to empty.
I am completely new to gitHub. Please forgive me if I am violating any rules here as I am sure you will let me know if I am.
Answers (2)
Hi @paulwright75 can you create a reproducible demo, please?
This issue has been automatically closed because there has been no response to our request for more information from the original author. With only the information that is currently in the issue, we don't have enough information to take action. Please reach out if you have or find the answers we need so that we can investigate further.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1025
How add new traits to custom block
grapesjs.plugins.add('CustomBlocks', function(editor, options) { options = options || {}; TraitsToComponent(); addHTMLCodeComponent(); addH...
Issue #2906
BUG: editor.refresh() not working in custom setup
I have a problem with a custom setup where the canvas iframe is moved around with js. The "editor.refresh()" call does not fix the position...
Issue #1047
[BUG] Model not able to change after changing value in custom Select dropdown menu.
Hey, I'm using CDN link for grapes js from unpkg.com In my project, I've used custom trait as a drop-down select menu which changes HTML us...
Issue #3574
QUESTION: adding traits are not picked up by trait manager.
Following example from docs . Is there further configurtion to make new traitsa show for elements? The example using the input does not run...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.