FormBuilder.js: 如何继承radio-group控制?
FormBuilder.js: How to inherit from radio-group control?
我正在尝试为 FormBuilder 创建一个新控件,它基本上是一个单选组控件(我的意思是它具有与单选组控件相同的配置)但我需要定义一个自定义 build() 和onRender() 方法。
我阅读了很多次文档,但无法正常工作,这是我正在尝试做的一个简单示例。
if (!window.fbControls) window.fbControls = new Array();
window.fbControls.push(function (controlClass) {
class controlMultipleObjects extends controlClass {
static get definition() {
return {
icon: '\uD83D\uDD89',
i18n: {
default: 'Control Multiple Items'
}
};
}
configure() {
// this.js = '//cdn.jsdelivr.net/npm/signature_pad@2.3.2/dist/signature_pad.min.js';
}
/**
* build a text DOM element, supporting other jquery text form-control's
* @return DOM Element to be injected into the form.
*/
build() {
this.dom = this.markup('div', null, {class:'multipleObjectsController', id: this.config.name});
return this.dom;
}
onRender() {
}
}
// register this control for the following types & text subtypes
controlClass.register('multipleObjects', controlMultipleObjects);
return controlMultipleObjects;
});
这基本上有效,新控件 'multipleObjects' 显示在表单生成器中,但是当打开控件的配置时它只显示 'Value' 项。我需要显示多个值,就像单选组、select 或 select 组控件一样。
有什么想法吗?
谢谢!
看看https://formbuilder.online/docs/formBuilder/options/typeUserAttrs
您需要像这样在 formBuilder 中传递选项:
const options = {
typeUserAttrs: {
multipleObjects: {
options: {
label: 'Class',
multiple: true,
options: {
'red form-control': 'Red',
'green form-control': 'Green',
'blue form-control': 'Blue'
},
},
},
},
}
$("#fb-editor").formBuilder(options)
我正在尝试为 FormBuilder 创建一个新控件,它基本上是一个单选组控件(我的意思是它具有与单选组控件相同的配置)但我需要定义一个自定义 build() 和onRender() 方法。
我阅读了很多次文档,但无法正常工作,这是我正在尝试做的一个简单示例。
if (!window.fbControls) window.fbControls = new Array();
window.fbControls.push(function (controlClass) {
class controlMultipleObjects extends controlClass {
static get definition() {
return {
icon: '\uD83D\uDD89',
i18n: {
default: 'Control Multiple Items'
}
};
}
configure() {
// this.js = '//cdn.jsdelivr.net/npm/signature_pad@2.3.2/dist/signature_pad.min.js';
}
/**
* build a text DOM element, supporting other jquery text form-control's
* @return DOM Element to be injected into the form.
*/
build() {
this.dom = this.markup('div', null, {class:'multipleObjectsController', id: this.config.name});
return this.dom;
}
onRender() {
}
}
// register this control for the following types & text subtypes
controlClass.register('multipleObjects', controlMultipleObjects);
return controlMultipleObjects;
});
这基本上有效,新控件 'multipleObjects' 显示在表单生成器中,但是当打开控件的配置时它只显示 'Value' 项。我需要显示多个值,就像单选组、select 或 select 组控件一样。
有什么想法吗?
谢谢!
看看https://formbuilder.online/docs/formBuilder/options/typeUserAttrs
您需要像这样在 formBuilder 中传递选项:
const options = {
typeUserAttrs: {
multipleObjects: {
options: {
label: 'Class',
multiple: true,
options: {
'red form-control': 'Red',
'green form-control': 'Green',
'blue form-control': 'Blue'
},
},
},
},
}
$("#fb-editor").formBuilder(options)