Выпадающий список со статусами

status-drop-down.js

// выпадающий список со статусами
UI.commonFuncs.statusSelect = function () {
	var selectSelector = 'select.select-status';
	var $selects = $(selectSelector);

	console.log($selects);

	if (!$selects.length) return;

	var template = [
		'<span class="status  status_{{status-mod}}">',
			'<i class="status__icon"></i>',
			'<span class="status__text">{{status-text}}</span>',
		'</span>'
	].join('\n');

	var valuesMap = {
		'on-agreement': {
			'status-mod': 'on-agreement',
			'status-text': 'В ожидании'
		},
		'denied': {
			'status-mod': 'denied',
			'status-text': 'Отклонено'
		},
		'confirmed': {
			'status-mod': 'confirmed',
			'status-text': 'Подтверждено'
		}
	};

	function updateSelected($chosenContainer, value) {
		var $headBlock = $chosenContainer.find('.chosen-single span');
		$headBlock
			.html(template.replace(/\{\{(.*?)\}\}/g, function(match, token) {
				return valuesMap[value][token];
			}));
	};

	for (var len = $selects.length; len > 0; len--) {
		var $self = $selects.eq(len - 1);
		var select = $self.get(0);

		if (select.value == '')
			continue;

		updateSelected($self.next('.chosen-container '), select.value);

		$self.on('change', function(e, params) {
			var select = e.target;
			var value = params.selected;
			var $chosenContainer = $(e.target).next('.chosen-container ');
			var $headBlock = $chosenContainer.find('.chosen-single span');

			console.log(value);

			updateSelected($chosenContainer, value);
		});

		$self.on('chosen:showing_dropdown', function(e, params) {
			var select = e.target;
			var selectOptions = select.options;
			var $container = params.chosen.container;
			var $dropdown = params.chosen.dropdown;
			var $items = $dropdown.find('.chosen-results li');

			$items.each(function(index, element) {
				var value = selectOptions[index].value;
				var $item = $items.eq(index);
				$item.html(template.replace(/\{\{(.*?)\}\}/g, function(match, token) {
					return valuesMap[value][token];
				}));
			});
		});
	}
}