Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migration of unmigrated content due to installation of a new plugin

window.almworks.structure.api.ColumnOption

Excerpt

ColumnOption class represents a single column configuration parameter.

It needs to be subclassed for particular column type implementation and passed as return value in ColumnConfigurator.getOptions() method.

Options are displayed in column configuration dialog one after another with labels on the left and inputs on the right.

Example

Code Block
javascript
javascript
var api = window.almworks.structure.api;

var MyOption1 = api.subClass('MyOption', api.ColumnOption, {
  title: 'Some option',
  init: function() {
    this.input$ = null;
  },
  createInput: function(div$) {
    this.input$ = div$.append('<input type="text" class="text">').find('input');
    var params = this.spec.params;
    this.input$.on('change', function() {
      if (params.someOptionAvaiable) {
        params.someOption = $(this).val();
        div$.trigger('notify');
      }
    });
  },
  notify: function() {
    var available = this.spec.params.someOptionAvaiable;
    this.input$.val(available ? (this.spec.params.someOption || '42') : '');
    return available;
  }
});

Properties

title

If set, title is displayed as a label to the left of the input controls. Option title representation may be overridden in #createLabel(div$) method.

Required Methods

You need to override the following methods.

createInput(div$)

Should be overridden to provide custom HTML for the option input. div$ parameter provides parent option element to append your view to. Created input should trigger 'notify' event on div$ to notify Structure of any column parameters change.

Please honor the AUI Forms HTML layout when creating your input controls!

Example

Code Block
javascript
javascript
createInput: function(div$) {
  var self = this;
  this.input$ = $('<input type="text" class="text">').appendTo(div$).on('change', function() {
    if (self.spec.params.myOption !== $(this).val()) {
      self.spec.params.myOption = $(this).val();
      div$.trigger('notify');
    }
  });
}

Other Methods

init(options)

Optional initializer.

createLabel(div$)

May be overridden to provide custom HTML view for the input label. div$ parameter provides parent option element to append your view to. By default creates a right-aligned label with text of the #title property.

Please honor the AUI Forms HTML layout if you override this method!

notify()

This method is called when the column configuration has changed. The implementation may want to update its controls to reflect those changes. The method should return a boolean indicating whether this option is available. Unavailable options will not be shown on the configuration panel. The default implementation does nothing and always returns true.

Example

Code Block
javascript
javascript
notify: function() {
  this.input$.val(this.spec.params.myOption);
  return true;
}

isInputValid()

Returns true if the current column specification is valid from the point of view of this option. The column configuration won't be saved unless all of the options approve the specification. The default implementation does nothing and returns true.

Example

Code Block
javascript
javascript
isInputValid: function() {
  // Check that the "field" specification parameter is present.
  return !!this.spec.params.field;
}