0

Есть скрипт, ищет по введённому слову совпадения в списке select. Нужно сделать чтобы в найденные результаты не включались элементы с атрибутом disabled. Сам код:

jQuery.fn.filterByText = function(textbox, selectSingleMatch) {
    return this.each(function() {
        var select = this;
        var options = [];
        $(select).find('option').each(function() {
            options.push({
                value: $(this).val(),
                text: $(this).text()
            });
        });
        $(select).data('options', options);
        $(textbox).bind('change keyup', function() {
            var options = $(select).empty().scrollTop(0).data('options');
            var search = $.trim($(this).val());
            var regex = new RegExp(search, 'gi');
            $.each(options, function(i) {
                var option = options[i];
                if (option.text.match(regex) !== null) {
                    $(select).append(
                        $('<option>').text(option.text).val(option.value)
                    );
                }
            });
            if (selectSingleMatch === true &&
                $(select).children().length === 1) {
                $(select).children().get(0).selected = true;
            }
        });
    });
};

$(function() {
    $('#select').filterByText($('#text'), true);
});

2 ответа 2

1
// Замените эту часть кода
$(select).find('option')
// на эту
$(select).find('option:not(:disabled)')

UPD

;(function ($) {
    $.fn.filterByText = function (opt) {

        opt = $.extend({
            input: null,
            byVal: true,
            byTxt: true,
            allowDisable: false,
            singleMatch: false
        }, opt);

        var filtering = function () {
            if (!opt.input) return false;
            var $that = $(this),
                cache = $('option', $that);
            $(document).on('input', opt.input, function () {
                var search = $.trim($(this).val()),
                    re = new RegExp(search, 'gi');
                if (search == '') $that.html(cache).prop('selectedIndex', 0);
                if (!opt.singleMatch && search.length <= 1) return false;
                $that.empty();
                cache.filter(function () {
                    if ($(this).is(':disabled') && !opt.allowDisable) return false;
                    return (opt.byVal && $(this).val().match(re) || opt.byTxt && $(this).text().match(re));
                }).appendTo($that);

            });
        };
        return this.each(filtering);
    };
})(jQuery);
// пример использования
$('#select').filterByText({
    input: '#text', // селектор поля ввода поисковой фразы
    byVal: true, // по текстовому описанию, true/false
    byTxt: true, // по значению option, true/false
    singleMatch: false, // начинать поиск с первого символа, true/false
    allowDisable: true // учитывать option:disabled, true/false
});
5
  • возник вопрос, как проверить является ли элемент disabled? строка вида options.push({value: $(this).val(), text: $(this).text(), color: $(this).css("color") , if($(this).is(':disabled')) { dis: '1'; } else { dis: '0'; } }); не работает
    – Rufex
    29 апр 2015 в 8:38
  • и так тоже ...color: $(this).css("color") , dis: $(this).is(':disabled')
    – Rufex
    29 апр 2015 в 8:41
  • разобрался, всё верно. теперь кода стираешь текст, весь список возвращается обратно, но элементов с disabled нету
    – Rufex
    29 апр 2015 в 8:55
  • @Rufex, дополнил в ответе. Делал на скорую руку, поэтому потестируйте, а если будут какие-то баги, то попробуем разобрать ближе к вечеру.
    – Deonis
    29 апр 2015 в 10:09
  • решил немного по другому
    – Rufex
    29 апр 2015 в 12:41
0

решил так

jQuery.fn.filterByText = function(textbox, selectSingleMatch) {
return this.each(function() {
var select = this;
var options = [];
$(select).find('option').each(function() {
options.push({value: $(this).val(), text: $(this).text(), color: $(this).css("color") , dis: $(this).is(':disabled') });
});
$(select).data('options', options);
$(textbox).bind('change keyup', function() {
var options = $(select).empty().scrollTop(0).data('options');
var search = $.trim($(this).val());
var regex = new RegExp(search,'gi');
if (search) {
$.each(options, function(i) {
var option = options[i];
if(option.text.match(regex) !== null) {
if(option.dis == true) {
var dise = 'none';
} else { var dise = 'block'; }
$(select).append(
$('<option>').text(option.text).val(option.value).css('display', dise)
);
}
});
} else {
$.each(options, function(i) {
var option = options[i];
if(option.text.match(regex) !== null) {
if(option.dis == true) {
var dise = 'disabled';
} else { var dise = 'enabled'; }
$(select).append(
$('<option>').text(option.text).val(option.value).css('color', option.color).attr(dise, true)
);
}
});
}
if (selectSingleMatch === true && 
$(select).children().length === 1) {
$(select).children().get(0).selected = true;
}
});
});
};
$(function() {
$('#scat').filterByText($('#cats'), true);
});

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.