элемент select показывает только первый символ

У меня есть элемент select html, который заполняется jquery внутри вызова ajax. Кажется, все работает нормально, но в IE9 в поле выбора отображается только первый символ текста.

Вот jsfiddle, который воспроизводит поведение:

http://jsfiddle.net/PjDfS/

Я знаю, что здесь задавался тот же вопрос. ‹select› показывает только первый символ выбранного варианта, но в моем случае решение не работает. (http://jsfiddle.net/PjDfS/2/)

Любая помощь будет высоко ценится.


html jquery internet-explorer-9
person Manuel Navarro    schedule 21.08.2012    source источник

Ответы (4)


arrow_upward
1
arrow_downward

Наконец, рабочий код:

http://jsfiddle.net/PjDfS/5/

Что я сделал? В конце концов, я возвращаюсь к старому ответу на пост и немного меняю свой первый подход.

Для большей ясности оставьте исходный выбор как «display: none», а в конце удалите атрибут.

person Manuel Navarro    schedule 21.08.2012
comment
... это мой принятый ответ, но я не могу подтвердить его сейчас, мне нужно подождать два дня - person Manuel Navarro; 22.08.2012

arrow_upward
0
arrow_downward

Я думаю, что проблема с IE9 связана с

var messageFieldInput = $('#MessageFieldInputTemplate > .messageField-input').clone()

Здесь :

var testObj = [];
testObj[0] = {
    text: 'description 1',
    value: 'value 1'
};
testObj[1] = {
    text: 'description 2',
    value: 'value 2'
};

$.get('/echo/json', function (data) {
    var messageFieldInput = $('#MessageFieldInputTemplate > .messageField-input'); //no .clone()
    $('#MessageFieldContainer').append(messageFieldInput);
    messageFieldInput.find('.editor-label').text('Label');

    $.get('/echo/json', function (data) {
        var fieldSelect = messageFieldInput.find('.editor-field > select');            

        $.each(testObj , function (index, item) {
            fieldSelect.append(
                $('<option/>', {
                    'value':item.value,
                    'text':item.text
})
            );
        });
    });
});
person Philippe Boissonneault    schedule 21.08.2012
comment
Это хорошая идея, но мне нужно добавить более одного элемента select и без клонирования элемента шаблона, что невозможно. - person Manuel Navarro; 21.08.2012

arrow_upward
0
arrow_downward

Попробуйте добавить один option в свой select в разметке, а затем удалите его с помощью скрипта.

Похоже, что текст такой опции каким-то образом «выделяет» горизонтальное пространство, и вы не сможете получить заполненные ajax тексты, которые больше не отображаются правильно.

ОБНОВЛЕНИЕ: Пробовал, но это сложнее .. Работает только до тех пор, пока вы не сохраните исходную опцию :(

person Michal Klouda    schedule 21.08.2012
comment
Мне жаль слышать, что это не работает ... на самом деле это довольно странное поведение - person Manuel Navarro; 21.08.2012

arrow_upward
0
arrow_downward

Я не знаю почему, но, похоже, этот способ работает:

http://jsfiddle.net/PjDfS/4/

Кроме того, я не уверен, является ли код точным эквивалентом. Все равно пока работает ...

person Manuel Navarro    schedule 21.08.2012
comment
Хорошо, после попытки реализовать этот подход в моем приложении «реального мира» оказалось, что если вы действительно используете данные, возвращаемые вызовом AJAX, это не сработает (это означает, что IE9 продолжит показывать только первый символ). ... но хорошо то, что после множества ругательств и нецензурных слов мне удалось заставить это работать. См. Мой принятый ответ ... - person Manuel Navarro; 22.08.2012