Add support for values to trigger API

This commit is contained in:
Sam Georges 2014-07-24 19:55:27 +10:00
parent c0e7beebf7
commit 1d90ae25f7
1 changed files with 25 additions and 8 deletions

View File

@ -8,11 +8,14 @@
* Supported data attributes:
* - data-trigger-type, values: display, hide, enable, disable
* - data-trigger: a CSS selector for elements that trigger the action (checkboxes)
* - data-trigger-condition, values: checked (more conditions to add later) - determines the condition the elements
* specified in the data-trigger should satisfy in order the condition to be considered as "true".
* - data-trigger-condition, values:
* - checked: determines the condition the elements specified in the data-trigger
* should satisfy in order the condition to be considered as "true".
* - value[somevalue]: determines if the value of data-trigger equals the specified value (somevalue)
* the condition is considered "true".
*
* Example: <input type="button" class="btn disabled"
* data-trigger-type="enable"
* data-trigger-type="enable"
* data-trigger="#cblist input[type=checkbox]"
* data-trigger-condition="checked" ... >
*
@ -28,7 +31,7 @@
var TriggerOn = function (element, options) {
var $el = this.$el = $(element);
this.options = options || {};
if (this.options.triggerCondition === false)
@ -40,10 +43,20 @@
if (this.options.triggerType === false)
throw new Error('Trigger type is not specified.')
if (this.options.triggerCondition == 'checked')
this.triggerCondition = this.options.triggerCondition
if (this.options.triggerCondition.indexOf('value') == 0) {
var match = this.options.triggerCondition.match(/[^[\]]+(?=])/g)
if (match) {
this.triggerConditionValue = match
this.triggerCondition = 'value'
}
}
if (this.triggerCondition == 'checked' || this.triggerCondition == 'value')
$(document).on('change', this.options.trigger, $.proxy(this.onConditionChanged, this))
var self = this;
var self = this
$el.on('oc.triggerOn.update', function(e){
e.stopPropagation()
self.onConditionChanged()
@ -53,8 +66,12 @@
}
TriggerOn.prototype.onConditionChanged = function() {
if (this.options.triggerCondition == 'checked')
this.updateTarget($(this.options.trigger + ':checked').length > 0);
if (this.triggerCondition == 'checked') {
this.updateTarget($(this.options.trigger + ':checked').length > 0)
}
else if (this.triggerCondition == 'value') {
this.updateTarget($(this.options.trigger).val() == this.triggerConditionValue)
}
}
TriggerOn.prototype.updateTarget = function(status) {