bind-filter

Bind filter module (UI)

####Example config:

// miid of crud module
crud: 'crud',
// ui configuration (optional)
ui: {
    //operator order configuration (optional)
    //this will tell the module in whitch order to display the operators
    "operatorOrder": [
        "regExp",
        "in",
        "=",
        "!=",
        ">",
        "<",
        ">=",
        "<=",
        "exists",
        "notin",
        "all"
    ],
    // what DOM event will trigger a filter UI interaction?
    events: {
        add: 'click',
        cancel: 'click',
        create: 'click',
        remove: 'click',
        itemEdit: 'click',
        itemRemove: 'click'
    },
    // the container of the filter form
    filter: '.filter',
    // the container of the filter list
    list: '.filter-list',
    // the selector to the filter list item template
    listItem: 'li',
    // the value label selector (probably to be renamed to "container")
    valueLabel: '.valueLabel',
    // the value field container (can be 0 or more values, depending on the operator)
    valueField: '.valueField',
    // the template selector input element
    templateSelector: '.templates',
    // DOM references to the field and operator inputs
    inputs: {
        field: 'select[name=field]',
        operator: 'select[name=operator]'
    },
    // DOM references to the filter UI controls
    controls: {
        create: 'button[name=create]',
        save: 'button[name=save]',
        cancel: 'button[name=cancel]',
        remove: 'button[name=remove]'
    },
    // filter list item reference
    item: {
        // enable-diable filter DOM reference
        onoff: '.onoff > input',
        // filter field DOM reference
        field: '.field',
        // filter operator DOM reference
        operator: '.operator',
        // filter value DOM reference
        value: '.value',
        // filter remove control DOM reference
        remove: '.remove',
        // filter edit DOM reference
        edit: '.edit'
    },
    // configure message dom
    message: {
        // the message container
        container: '.message',
        // the measste text
        text: '.message .text'
    },
    // configure loader dom refs
    loader: {
        // the actual loader
        loader: '.progress',
        // all elements that should be hidden during a request
        hide: '.hideOnLoad'
    },

    // set custom classes on filter inputs
    classes: {
        // set class for the value field
        value: "myCustomClass"
    }
},
// pre-defined filters
setFilters: [
    {
        field: 'id',
        operator: 'all',
        value: 'value1, value2 value3',
        // start state of the filter
        disabled: false,
        // do not allow UI removal
        fixed: true,
        // hide from the UI
        hidden: true
    },
    {
        field: 'name',
        operator: '=',
        value: 'herbert'
    }
],
// define templates to select
setTemplates: ['typeA', 'template', 'typeB'],
// set template
template: 'template',

// listen to external events
listen: {
    /*
        see here how to config:
        https://github.com/jillix/events
    */
}

####Event interface #####result

self.emit('result', function (err, data) {});

Errors:

• NO_TEMPLATE_SELECTED when a filtering is started before a template is set for the filter module
• FILTER_IS_BUSY when a filtering is started while a previous one is not yet finished
• NO_FILTERS_SELECTED when a 2nd consecutive filtering operation is tried with no query

#####setFilters

self.on('setFilters', [{
    field: 'fieldName',
    operator: '=',
    value: 23,
    disabled: false,
    hidden: false,
    fixed: false
}]);

Supported operators

Operator	Mongo Equivalent	Comments
=	key: value notation
!=	$ne
>	$gt
<	$lt
>=	$gte
<=	$lte
all	$all
in	$in
notin	$nin
regExp	$regex
exists	$exists

#####setTemplate

self.emit('setTemplate', 'templateName', function () {});

#####setTemplates

self.emit('setTemplate', ['templateName'], function () {});

#####setOptions

/*
if true is set as second parameter, the options are set
to the first parameter, otherwise the options are merged
*/
self.emit('setOptions', {limit: 20, fields: {}, ...}, true);

#####template

self.emit('template', {
    id: '',
    name: '',
    schema: {/*modm schema*/}
};

#####templates

self.emit('templates', [{
    id: '',
    name: '',
    schema: {/*modm schema*/}
}];

#####message

self.emit('message', 'error', 'Message text');

Types: alert error success info

Changelog

v0.3.0

• from now on, do not fetch data using a CRUD read (find) operation when editing disabled filters
• transferred module to the new jxMono organization
• updated Bind to v0.4.0, Events to v0.4.0, Utils to v0.2.0

v0.2.6

• Fixed editing disabled filters (they are not enabled back)

v0.2.5

• Find function no longer emits a count

v0.2.4

• Fixed broken value spliting for $in and $nin operators

v0.2.3

• Fixed disabled class handling that was overwriting other existing classes of a filter-item when adding a new filter while others were disabled
• Updated to Utils v0.1.6

v0.2.2

• Updated to Bind v0.3.1

v0.2.1

• Handle $or operator correctly
• Added utils library as dependency
• Replaced double quotes with simple ones

v0.2.0

• added dynamic custom pre-defined filter support
• Updated to [email protected] and [email protected]

v0.1.9

• Enable the filter if it is disabled when saving it

v0.1.8

• fixed setAttribute bug #22

v0.1.7

• Events v0.1.8

v0.1.6

• Fixed the wrong condition when selecting "first item" in the field select: search for first non-core key and which doesn't have noSearch: true

v0.1.5

• getItem fetches now only one item

v0.1.4

• added comparison operators to date values

v0.1.3

• send hidden field in getFilters
• update to Bind v0.2.1

v0.1.2

• crudFindBusy = false before handling the error from find request
• fixed displaying Array values in the value input in IE8

v0.1.1

• callback function feature for findfunction

v0.1.0

• Initial versioned release