|
|
|
@ -11,7 +11,7 @@ class SimpleSelect { |
|
|
|
|
|
|
|
|
|
|
|
static getTemplate(header, id) { |
|
|
|
static getTemplate(header, id) { |
|
|
|
let insert_template = ` |
|
|
|
let insert_template = ` |
|
|
|
<input class="select-box-search" type="text"> |
|
|
|
<input class="select-box-search" type="text" placeholder="Выберите/Поиск"> |
|
|
|
<span style="clear:both; display:block"></span> |
|
|
|
<span style="clear:both; display:block"></span> |
|
|
|
`;
|
|
|
|
`;
|
|
|
|
|
|
|
|
|
|
|
|
@ -38,6 +38,7 @@ class SimpleSelect { |
|
|
|
<ul> |
|
|
|
<ul> |
|
|
|
</ul> |
|
|
|
</ul> |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
|
|
|
|
<button class="button-add results">добавить</button> |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
<span style="clear: both"></span> |
|
|
|
<span style="clear: both"></span> |
|
|
|
@ -63,6 +64,13 @@ class SimpleSelect { |
|
|
|
this.$header.html(header); |
|
|
|
this.$header.html(header); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
getSelectedElements() { |
|
|
|
|
|
|
|
let all_checked = this.$results_box.find(":checked"); |
|
|
|
|
|
|
|
return all_checked.map(function () { |
|
|
|
|
|
|
|
return $(this).data("id"); |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
static _collectData($container) { |
|
|
|
static _collectData($container) { |
|
|
|
let $options = $container.find('option'); |
|
|
|
let $options = $container.find('option'); |
|
|
|
@ -126,7 +134,7 @@ class SimpleSelect { |
|
|
|
this.$results_box = this.$select_box.find('.select-box-results'); |
|
|
|
this.$results_box = this.$select_box.find('.select-box-results'); |
|
|
|
this.$options_box = this.$select_box.find('.select-box-options'); |
|
|
|
this.$options_box = this.$select_box.find('.select-box-options'); |
|
|
|
this.$search_input = this.$select_box.find('input.select-box-search'); |
|
|
|
this.$search_input = this.$select_box.find('input.select-box-search'); |
|
|
|
// this.$button_add = this.$results_box.find('.button-add');
|
|
|
|
this.$button_add = this.$results_box.find('.button-add'); |
|
|
|
// this.$button_add_options = this.$select_box.find('.button-add.options');
|
|
|
|
// this.$button_add_options = this.$select_box.find('.button-add.options');
|
|
|
|
// this.$editable_container = this.$select_box.find('.editable-container');
|
|
|
|
// this.$editable_container = this.$select_box.find('.editable-container');
|
|
|
|
this._fillOptionsData(); |
|
|
|
this._fillOptionsData(); |
|
|
|
@ -139,7 +147,7 @@ class SimpleSelect { |
|
|
|
_looseFocus() { |
|
|
|
_looseFocus() { |
|
|
|
this.$results_box.hide(); |
|
|
|
this.$results_box.hide(); |
|
|
|
this.$options_box.hide(); |
|
|
|
this.$options_box.hide(); |
|
|
|
if (!this.selected_id) this.$search_input.val(""); |
|
|
|
this.$search_input.val(""); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
_bindEvents() { |
|
|
|
_bindEvents() { |
|
|
|
@ -166,20 +174,30 @@ class SimpleSelect { |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// this.$button_add.on("click", function (e) {
|
|
|
|
this.$button_add.on("click", function (e) { |
|
|
|
// self._onButtonAdd(e);
|
|
|
|
self._onButtonAdd(e); |
|
|
|
// });
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
_onclickOptionsElement(e) { |
|
|
|
_onclickOptionsElement(e) { |
|
|
|
console.log("selelc with id =", $(e.target).data("id")); |
|
|
|
console.log("selelc with id =", $(e.target).data("id")); |
|
|
|
let el_id = $(e.target).data("id"); |
|
|
|
this.selected_id = $(e.target).data("id"); |
|
|
|
this.selected_id = el_id; |
|
|
|
|
|
|
|
// this.$search_input.val($(e.target).html());
|
|
|
|
|
|
|
|
if (this.selected_container) this.selected_container.add(this.selected_id, 40); |
|
|
|
if (this.selected_container) this.selected_container.add(this.selected_id, 40); |
|
|
|
this.$options_box.hide(); |
|
|
|
this.$options_box.hide(); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
_onButtonAdd(e) { |
|
|
|
|
|
|
|
let self = this; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.getSelectedElements().each(function () { |
|
|
|
|
|
|
|
console.log("add el -->", this); |
|
|
|
|
|
|
|
self.selected_container.add(this, 40); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
this.clear(); |
|
|
|
|
|
|
|
e.preventDefault(); |
|
|
|
|
|
|
|
return false; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |