RetailCRM-Mirror/select2
1
0
Fork 0
mirror of synced 2024-11-22 13:06:08 +03:00
Code Issues Projects Releases Wiki Activity

Add classes to results options

Browse Source
This commit is contained in:
Kevin Brown 2014-08-28 16:00:56 -04:00
parent 01c3dc5886
commit 2ca14517bb
8 changed files with 229 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
dist/css/select2.css vendored
View File

@ -43,6 +43,11 @@
.select2-container .dropdown .results .options .option {
cursor: pointer;
padding: 6px; }
.select2-container .dropdown .results .options .option.selected {
background-color: #ddd; }
.select2-container .dropdown .results .options .option.hovered {
background-color: darkblue;
color: white; }
.select2-container.open .dropdown {
border-top-left-radius: 0;
border-top-right-radius: 0;

49
dist/js/select2.amd.full.js vendored
View File

@ -153,7 +153,7 @@ define('select2/data/select',[
define('select2/results',[
'./utils'
], function (Utils) {
function Results ($element, dataAdapter) {
function Results ($element, options, dataAdapter) {
this.$element = $element;
this.data = dataAdapter;
@ -190,6 +190,29 @@ define('select2/results',[
this.$results.append($options);
};
Results.prototype.setClasses = function () {
var self = this;
this.data.current(function (selected) {
selected = $.map(selected, function (s) { return s.id; });
self.$results.find(".option.selected").removeClass("selected");
var $options = self.$results.find(".option");
console.log($options);
$options.each(function () {
var $option = $(this);
var item = $option.data("data");
if (selected.indexOf(item.id) > -1) {
$option.addClass("selected");
}
});
});
};
Results.prototype.option = function (data) {
var $option = $(
'<li class="option"></li>'
@ -207,10 +230,13 @@ define('select2/results',[
this.on("results:all", function (data) {
self.clear();
self.append(data);
self.setClasses();
});
this.on("results:append", function (data) {
self.append(data);
self.setClasses();
})
this.$results.on("click", ".option", function (evt) {
@ -219,7 +245,18 @@ define('select2/results',[
self.trigger("selected", {
originalEvent: evt,
data: data
})
});
self.setClasses();
});
this.$results.on("mouseenter", ".option", function (evt) {
self.$results.find(".option.hovered").removeClass("hovered");
$(this).addClass("hovered");
});
this.$results.on("mouseleave", ".option", function (evt) {
$(this).removeClass("hovered");
});
};
@ -337,7 +374,7 @@ define('select2/core',[
// Set up containers and adapters
this.data = new this.options.dataAdapter($element, options);
this.data = new this.options.dataAdapter($element, this.options);
var $container = this.render();
@ -345,21 +382,21 @@ define('select2/core',[
$container.width($element.width());
this.selection = new this.options.selectionAdapter($element, options);
this.selection = new this.options.selectionAdapter($element, this.options);
var $selectionContainer = $container.find(".selection");
var $selection = this.selection.render();
$selectionContainer.append($selection);
this.dropdown = new this.options.dropdownAdapter($element, options);
this.dropdown = new this.options.dropdownAdapter($element, this.options);
var $dropdownContainer = $container.find(".dropdown");
var $dropdown = this.dropdown.render();
$dropdownContainer.append($dropdown);
this.results = new this.options.resultsAdapter($element, options);
this.results = new this.options.resultsAdapter($element, this.options, this.data);
var $resultsContainer = $dropdown.find(".results");
var $results = this.results.render();

49
dist/js/select2.amd.js vendored
View File

@ -153,7 +153,7 @@ define('select2/data/select',[
define('select2/results',[
'./utils'
], function (Utils) {
function Results ($element, dataAdapter) {
function Results ($element, options, dataAdapter) {
this.$element = $element;
this.data = dataAdapter;
@ -190,6 +190,29 @@ define('select2/results',[
this.$results.append($options);
};
Results.prototype.setClasses = function () {
var self = this;
this.data.current(function (selected) {
selected = $.map(selected, function (s) { return s.id; });
self.$results.find(".option.selected").removeClass("selected");
var $options = self.$results.find(".option");
console.log($options);
$options.each(function () {
var $option = $(this);
var item = $option.data("data");
if (selected.indexOf(item.id) > -1) {
$option.addClass("selected");
}
});
});
};
Results.prototype.option = function (data) {
var $option = $(
'<li class="option"></li>'
@ -207,10 +230,13 @@ define('select2/results',[
this.on("results:all", function (data) {
self.clear();
self.append(data);
self.setClasses();
});
this.on("results:append", function (data) {
self.append(data);
self.setClasses();
})
this.$results.on("click", ".option", function (evt) {
@ -219,7 +245,18 @@ define('select2/results',[
self.trigger("selected", {
originalEvent: evt,
data: data
})
});
self.setClasses();
});
this.$results.on("mouseenter", ".option", function (evt) {
self.$results.find(".option.hovered").removeClass("hovered");
$(this).addClass("hovered");
});
this.$results.on("mouseleave", ".option", function (evt) {
$(this).removeClass("hovered");
});
};
@ -337,7 +374,7 @@ define('select2/core',[
// Set up containers and adapters
this.data = new this.options.dataAdapter($element, options);
this.data = new this.options.dataAdapter($element, this.options);
var $container = this.render();
@ -345,21 +382,21 @@ define('select2/core',[
$container.width($element.width());
this.selection = new this.options.selectionAdapter($element, options);
this.selection = new this.options.selectionAdapter($element, this.options);
var $selectionContainer = $container.find(".selection");
var $selection = this.selection.render();
$selectionContainer.append($selection);
this.dropdown = new this.options.dropdownAdapter($element, options);
this.dropdown = new this.options.dropdownAdapter($element, this.options);
var $dropdownContainer = $container.find(".dropdown");
var $dropdown = this.dropdown.render();
$dropdownContainer.append($dropdown);
this.results = new this.options.resultsAdapter($element, options);
this.results = new this.options.resultsAdapter($element, this.options, this.data);
var $resultsContainer = $dropdown.find(".results");
var $results = this.results.render();

49
dist/js/select2.full.js vendored
View File

@ -9690,7 +9690,7 @@ define('select2/data/select',[
define('select2/results',[
'./utils'
], function (Utils) {
function Results ($element, dataAdapter) {
function Results ($element, options, dataAdapter) {
this.$element = $element;
this.data = dataAdapter;
@ -9727,6 +9727,29 @@ define('select2/results',[
this.$results.append($options);
};
Results.prototype.setClasses = function () {
var self = this;
this.data.current(function (selected) {
selected = $.map(selected, function (s) { return s.id; });
self.$results.find(".option.selected").removeClass("selected");
var $options = self.$results.find(".option");
console.log($options);
$options.each(function () {
var $option = $(this);
var item = $option.data("data");
if (selected.indexOf(item.id) > -1) {
$option.addClass("selected");
}
});
});
};
Results.prototype.option = function (data) {
var $option = $(
'<li class="option"></li>'
@ -9744,10 +9767,13 @@ define('select2/results',[
this.on("results:all", function (data) {
self.clear();
self.append(data);
self.setClasses();
});
this.on("results:append", function (data) {
self.append(data);
self.setClasses();
})
this.$results.on("click", ".option", function (evt) {
@ -9756,7 +9782,18 @@ define('select2/results',[
self.trigger("selected", {
originalEvent: evt,
data: data
})
});
self.setClasses();
});
this.$results.on("mouseenter", ".option", function (evt) {
self.$results.find(".option.hovered").removeClass("hovered");
$(this).addClass("hovered");
});
this.$results.on("mouseleave", ".option", function (evt) {
$(this).removeClass("hovered");
});
};
@ -9874,7 +9911,7 @@ define('select2/core',[
// Set up containers and adapters
this.data = new this.options.dataAdapter($element, options);
this.data = new this.options.dataAdapter($element, this.options);
var $container = this.render();
@ -9882,21 +9919,21 @@ define('select2/core',[
$container.width($element.width());
this.selection = new this.options.selectionAdapter($element, options);
this.selection = new this.options.selectionAdapter($element, this.options);
var $selectionContainer = $container.find(".selection");
var $selection = this.selection.render();
$selectionContainer.append($selection);
this.dropdown = new this.options.dropdownAdapter($element, options);
this.dropdown = new this.options.dropdownAdapter($element, this.options);
var $dropdownContainer = $container.find(".dropdown");
var $dropdown = this.dropdown.render();
$dropdownContainer.append($dropdown);
this.results = new this.options.resultsAdapter($element, options);
this.results = new this.options.resultsAdapter($element, this.options, this.data);
var $resultsContainer = $dropdown.find(".results");
var $results = this.results.render();

49
dist/js/select2.js vendored
View File

@ -581,7 +581,7 @@ define('select2/data/select',[
define('select2/results',[
'./utils'
], function (Utils) {
function Results ($element, dataAdapter) {
function Results ($element, options, dataAdapter) {
this.$element = $element;
this.data = dataAdapter;
@ -618,6 +618,29 @@ define('select2/results',[
this.$results.append($options);
};
Results.prototype.setClasses = function () {
var self = this;
this.data.current(function (selected) {
selected = $.map(selected, function (s) { return s.id; });
self.$results.find(".option.selected").removeClass("selected");
var $options = self.$results.find(".option");
console.log($options);
$options.each(function () {
var $option = $(this);
var item = $option.data("data");
if (selected.indexOf(item.id) > -1) {
$option.addClass("selected");
}
});
});
};
Results.prototype.option = function (data) {
var $option = $(
'<li class="option"></li>'
@ -635,10 +658,13 @@ define('select2/results',[
this.on("results:all", function (data) {
self.clear();
self.append(data);
self.setClasses();
});
this.on("results:append", function (data) {
self.append(data);
self.setClasses();
})
this.$results.on("click", ".option", function (evt) {
@ -647,7 +673,18 @@ define('select2/results',[
self.trigger("selected", {
originalEvent: evt,
data: data
})
});
self.setClasses();
});
this.$results.on("mouseenter", ".option", function (evt) {
self.$results.find(".option.hovered").removeClass("hovered");
$(this).addClass("hovered");
});
this.$results.on("mouseleave", ".option", function (evt) {
$(this).removeClass("hovered");
});
};
@ -765,7 +802,7 @@ define('select2/core',[
// Set up containers and adapters
this.data = new this.options.dataAdapter($element, options);
this.data = new this.options.dataAdapter($element, this.options);
var $container = this.render();
@ -773,21 +810,21 @@ define('select2/core',[
$container.width($element.width());
this.selection = new this.options.selectionAdapter($element, options);
this.selection = new this.options.selectionAdapter($element, this.options);
var $selectionContainer = $container.find(".selection");
var $selection = this.selection.render();
$selectionContainer.append($selection);
this.dropdown = new this.options.dropdownAdapter($element, options);
this.dropdown = new this.options.dropdownAdapter($element, this.options);
var $dropdownContainer = $container.find(".dropdown");
var $dropdown = this.dropdown.render();
$dropdownContainer.append($dropdown);
this.results = new this.options.resultsAdapter($element, options);
this.results = new this.options.resultsAdapter($element, this.options, this.data);
var $resultsContainer = $dropdown.find(".results");
var $results = this.results.render();

8
src/js/select2/core.js vendored
View File

@ -11,7 +11,7 @@ define([
// Set up containers and adapters
this.data = new this.options.dataAdapter($element, options);
this.data = new this.options.dataAdapter($element, this.options);
var $container = this.render();
@ -19,21 +19,21 @@ define([
$container.width($element.width());
this.selection = new this.options.selectionAdapter($element, options);
this.selection = new this.options.selectionAdapter($element, this.options);
var $selectionContainer = $container.find(".selection");
var $selection = this.selection.render();
$selectionContainer.append($selection);
this.dropdown = new this.options.dropdownAdapter($element, options);
this.dropdown = new this.options.dropdownAdapter($element, this.options);
var $dropdownContainer = $container.find(".dropdown");
var $dropdown = this.dropdown.render();
$dropdownContainer.append($dropdown);
this.results = new this.options.resultsAdapter($element, options);
this.results = new this.options.resultsAdapter($element, this.options, this.data);
var $resultsContainer = $dropdown.find(".results");
var $results = this.results.render();

41
src/js/select2/results.js vendored
View File

@ -1,7 +1,7 @@
define([
'./utils'
], function (Utils) {
function Results ($element, dataAdapter) {
function Results ($element, options, dataAdapter) {
this.$element = $element;
this.data = dataAdapter;
@ -38,6 +38,29 @@ define([
this.$results.append($options);
};
Results.prototype.setClasses = function () {
var self = this;
this.data.current(function (selected) {
selected = $.map(selected, function (s) { return s.id; });
self.$results.find(".option.selected").removeClass("selected");
var $options = self.$results.find(".option");
console.log($options);
$options.each(function () {
var $option = $(this);
var item = $option.data("data");
if (selected.indexOf(item.id) > -1) {
$option.addClass("selected");
}
});
});
};
Results.prototype.option = function (data) {
var $option = $(
'<li class="option"></li>'
@ -55,10 +78,13 @@ define([
this.on("results:all", function (data) {
self.clear();
self.append(data);
self.setClasses();
});
this.on("results:append", function (data) {
self.append(data);
self.setClasses();
})
this.$results.on("click", ".option", function (evt) {
@ -67,7 +93,18 @@ define([
self.trigger("selected", {
originalEvent: evt,
data: data
})
});
self.setClasses();
});
this.$results.on("mouseenter", ".option", function (evt) {
self.$results.find(".option.hovered").removeClass("hovered");
$(this).addClass("hovered");
});
this.$results.on("mouseleave", ".option", function (evt) {
$(this).removeClass("hovered");
});
};

9
src/scss/_dropdown.scss
View File

@ -27,6 +27,15 @@
.option {
cursor: pointer;
padding: 6px;
&.selected {
background-color: #ddd;
}
&.hovered {
background-color: darkblue;
color: white;
}
}
}
}