ColumnOption Class

window.almworks.structure.api.ColumnOption

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


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


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


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


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