2010-08-13 3 views
3

Как стилизовать элемент списка выбора? Вот мой код, как сейчас ...Стиль элемента списка выбора в jEditable

$('.editableSelect').editable(function(value, settings) { 
    if (this.revert == value) { 
     this.reset(); 
     return; 
    } 
    setSaveButtonRed(this); 
    setDescFromAccountCode(this, value); 
    return (value); 
}, { 
    type: 'select', 
    submit: '<button type="submit" class="checkbookButton">OK</button>', 
    data: $('#accountCodesForSelect').val(), 
    cssclass: 'checkbookSelect', 
    //style: 'font-family: Verdana,Helvetica,Sans-Serif; font-size:0.75em; width:700px;', 
    tooltip: "Click to edit...." 
}); 

и класс checkbookSelect выглядит так ...

.checkbookSelect 
{ 
    font-family:Verdana,Helvetica,Sans-Serif; 
    font-size:0.75em; 
} 

Но когда я нажимаю в, в этом случае ячейка таблицы (и jEditable fire), и появляется список выбора, это не стиль ...

Я думаю, что параметр cssclass в jEditable предназначен только для диапазона, который jEditable создает и, возможно, не применяется к любому элементу ввода, который он создает ... поэтому, возможно, ответ заключается в использовании более конкретных jQuery s выбор и/или jQuery в режиме live() для выбора элемента списка выбора, а затем применить стиль таким образом?

Обратите внимание, что я также пробовал использовать атрибут style/setting ... это прокомментировано выше.

BTW jEditable удивительный сценарий ... и я уже писал Аю, как настроить DatePicker и jEditable here ...

+0

Какой браузер вы используете, когда видите это? –

+0

IE8 ... и Firefox 3.whatever6? ... смешно, что другие списки выбора на странице принимают стиль ... Я просто устанавливаю шрифт и размер шрифта ... Я знаю, что выберите списки не отвечают на все настройки стиля в IE. – w4ik

ответ

2

был в состоянии установить стиль на выпадающем, добавив следующую строку в JQuery. jeditable.js вблизи линии 270 или около того версии 1.7.1 ... вероятно, не имеет значения, повторно точный номер строки, но я положил его туда, как и где автор сценария проверяет settings.select

$('select').addClass(settings.cssclass); 

I Я уверен, что селектор тоже может быть изменен ... но по крайней мере это работает сейчас ... Я затяну его позже, но на тот случай, если у кого-то будет такой же вопрос ... просто хотел, чтобы вы знали, как я получил его на работу

Я усовершенствовал селектор этого ...

$(form).children('select').addClass(settings.cssclass); 

работает намного лучше ...

0

другой путь для этого нужно установить все элементы с шириной: 100%, поле выбора будет исправлено внутри его DOM контейнера, но параметры будут отображаться правильно, проверено на firefox, не требует никакого Javascript и не будет влиять на все теги, вы можете добавить и id к определенным элементам для его стиля в соответствии с вашими потребностями

2

cssclass: 'checkbookSelect' будут применяться к форме тега.

Так что .checkbookSelect select вместо .checkbookSelect в вашем CSS должен выполнять эту работу.

Смежные вопросы