如何向AlloyUI表单生成器添加自定义属性

How to add custom attributes to AlloyUI form builder?

本文关键字：添加 自定义属性 表单 AlloyUI      更新时间：2024-02-02

我想做一些类似于这个jsfiddle的事情。例如，我需要在左面板属性上放置一些自定义属性。下面我试着做类似的，但我不能拖动字段

YUI().use('aui-form-builder',function (Y) {

Y.MyFormCustom=Y.Component.create({名称："表单节点"，

      ATTRS: {
          type: {
              value: 'custom'
          },
          customAttr: {
              validator: Y.Lang.isString,
              value: 'A Custom default'
          }
      },
      EXTENDS: Y.FormBuilderFieldBase,
      prototype: {
          getPropertyModel: function () {
              var instance = this;
              var model = Y.FormBuilderFieldBase.superclass.getPropertyModel.apply(instance, arguments);
              model.push({
                  attributeName: 'customAttr',
                  name: 'Custom Attribute'
              });
              return model;
          }
      }
  });
  Y.FormBuilder.types['custom'] = Y.MyFormCustom;
  var availableFields = [
    {
    iconClass: 'form-builder-field-icon-button',
    label: 'Button',
    type: 'custom'
    }
  ];
  myform= new Y.FormBuilder({
      availableFields: availableFields,
      boundingBox: '#myHolder'
  }).render();

我不知道为什么表格没有出现。任何帮助都将不胜感激。

您的示例对我很有帮助，因为我还需要扩展Form Builder字段。

解决上述问题很简单。更换线路：

Y.FormBuilder.types['custom'] = Y.MyFormCustom;

通过

Y.FormBuilderField.types['custom'] = Y.MyFormCustom;

此解决方案的灵感来自Alloy UI API中的源代码。请参阅链接：AlloyUI Form Builder

干杯

相关文章：