如何在AUI表单Builder中使用Ace Editor？

Question

我正在尝试在AUI表单构建器中添加一个ace编辑器作为组件。我不确定它是否会起作用，我正试一试。我没有找到任何代码如何在AUI表单构建器中添加自定义组件。

有人可以帮我吗？

＆＃13;

＆＃13;

YUI().use(
  'aui-form-builder',
  function(Y) {
    new Y.FormBuilder(
      {
        availableFields: [
          {
            iconClass: 'form-builder-field-icon-text',
            id: 'uniqueTextField',
            label: 'Text',
            readOnlyAttributes: ['name'],
            type: 'text',
            unique: true,
            width: 75
          },
          {
            hiddenAttributes: ['tip'],
            iconClass: 'form-builder-field-icon-textarea',
            label: 'Textarea',
            type: 'textarea'
          },
		   {
           
            iconClass: 'aui-ace-editor',
            label: 'AceEditor',
            type: 'AceEditor'
          },
          {
            iconClass: 'form-builder-field-icon-checkbox',
            label: 'Checkbox',
            type: 'checkbox'
          },
          {
            iconClass: 'form-builder-field-icon-button',
            label: 'Button',
            type: 'button'
          },
          {
            iconClass: 'form-builder-field-icon-select',
            label: 'Select',
            type: 'select'
          },
          {
            iconClass: 'form-builder-field-icon-radio',
            label: 'Radio Buttons',
            type: 'radio'
          },
          {
            iconClass: 'form-builder-field-icon-fileupload',
            label: 'File Upload',
            type: 'fileupload'
          },
          {
            iconClass: 'form-builder-field-icon-fieldset',
            label: 'Fieldset',
            type: 'fieldset'
          }
        ],
        boundingBox: '#myFormBuilder',
        fields: [
          {
            label: 'City',
            options: [
              {
                label: 'Ney York',
                value: 'new york'
              },
              {
                label: 'Chicago',
                value: 'chicago'
              }
            ],
            predefinedValue: 'chicago',
            type: 'select'
          },
          {
            label: 'Colors',
            options: [
              {
                label: 'Red',
                value: 'red'
              },
              {
                label: 'Green',
                value: 'green'
              },
              {
                label: 'Blue',
                value: 'blue'
              }
            ],
            type: 'radio'
          }
        ]
      }
    ).render();
  }
);

＆＃13;

<link href="http://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css" rel="stylesheet"/>
<script src="http://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>

＆＃13;

＆＃13;

＆＃13;