diff --git a/src/core.js b/src/core.js
index 305a9e53..b664e778 100644
--- a/src/core.js
+++ b/src/core.js
@@ -653,6 +653,11 @@ QueryBuilder.prototype.createRuleOperators = function(rule) {
return;
}
+ if (rule.filter.dynamic_filter) {
+ var $filterDynamic = $(this.getRuleFilterDynamic(rule.filter));
+ rule.$el.find(QueryBuilder.selectors.filter_container).append($filterDynamic);
+ }
+
var operators = this.getOperators(rule.filter);
var $operatorSelect = $(this.getRuleOperatorSelect(rule, operators));
diff --git a/src/defaults.js b/src/defaults.js
index b6c5a5eb..4815df53 100644
--- a/src/defaults.js
+++ b/src/defaults.js
@@ -155,6 +155,7 @@ QueryBuilder.DEFAULTS = {
templates: {
group: null,
rule: null,
+ filterDynamic: null,
filterSelect: null,
operatorSelect: null,
ruleValueSelect: null
diff --git a/src/public.js b/src/public.js
index 79491b96..20a73867 100644
--- a/src/public.js
+++ b/src/public.js
@@ -262,9 +262,14 @@ QueryBuilder.prototype.getRules = function(options) {
value = rule.value;
}
+ var filterName = rule.filter ? rule.filter.field : null;
+ if (rule.filter.dynamic_filter) {
+ filterName = rule.$el.find('.rule-filter-container input').val();
+ }
+
var ruleData = {
id: rule.filter ? rule.filter.id : null,
- field: rule.filter ? rule.filter.field : null,
+ field: filterName,
type: rule.filter ? rule.filter.type : null,
input: rule.filter ? rule.filter.input : null,
operator: rule.operator ? rule.operator.type : null,
diff --git a/src/template.js b/src/template.js
index 004d4693..20652391 100644
--- a/src/template.js
+++ b/src/template.js
@@ -65,7 +65,13 @@ QueryBuilder.templates.filterSelect = '\
\
{{~}} \
{{? optgroup !== null }}{{?}} \
-';
+\
+';
+
+QueryBuilder.templates.filterDynamic = '\
+
\
+ \
+';
QueryBuilder.templates.operatorSelect = '\
{{? it.operators.length === 1 }} \
@@ -191,6 +197,35 @@ QueryBuilder.prototype.getRuleFilterSelect = function(rule, filters) {
return this.change('getRuleFilterSelect', h, rule, filters);
};
+/**
+ * Returns rule's filter dynamic name HTML
+ * @param {Rule} rule
+ * @param {object[]} filters
+ * @returns {string}
+ * @fires QueryBuilder.changer:getRuleFilterTemplate
+ * @private
+ */
+QueryBuilder.prototype.getRuleFilterDynamic = function(filter) {
+ var h = this.templates.filterDynamic({
+ builder: this,
+ filter: filter,
+ icons: this.icons,
+ settings: this.settings,
+ translate: this.translate.bind(this)
+ });
+
+ /**
+ * Modifies the raw HTML of the rule's filter dynamic input
+ * @event changer:getRuleFilterSelect
+ * @memberof QueryBuilder
+ * @param {string} html
+ * @param {Rule} rule
+ * @param {QueryBuilder.Filter[]} filters
+ * @returns {string}
+ */
+ return this.change('getRuleFilterDynamic', h, filter);
+};
+
/**
* Returns rule's operator HTML
* @param {Rule} rule