Значки кнопок JQuery UI

У меня возникли проблемы с добавлением значков в набор кнопок jQuery UI. Добавление значков в кнопки работает отлично. У любого есть пример этой рабочей

Спасибо

Разметка

<div id="radio" class='demo'>
    <input type="radio" id="radio1" name="radio" /><label for="radio1">Top 10 FAQ's</label>
    <input type="radio" id="radio2" name="radio" /><label for="radio2">Last 30 Days</label>
</div>

Script

$("#radio").buttonset({ icons: { primary: 'ui-icon-triangle-1-ne'} });

Ответ 1

Update:

Я понял это; это было довольно просто.

$("#radio1").button({
    icons: {
        primary: 'ui-icon-gear',
        secondary: 'ui-icon-triangle-1-s'
    }
});

Спасибо, все!

Ответ 2

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

$("#choices").buttonset();
$('.graph_checks').button( "option", "icons", {primary:'ui-icon-circle-minus'})

Ответ 3

Мне нужно было добавить значок для выбранных флажков в набор кнопок и обновить их, когда пользователь меняет выбор.

var noIcon = {primary: null, secondary: null};
var withIcon = {primary: 'ui-icon-custom-tick', secondary: null};
$('#containerId input:checkbox').click(function(e) {
    if ($(e.target).button("option", "icons").primary == null) {
        $(e.target).button("option", "icons", withIcon).button('refresh');
    } else {
        $(e.target).button("option", "icons", noIcon).button('refresh');
    }
});
$('#containerId input:checkbox:checked').button({icons: withIcon});
$('#containerId input:checkbox:not(:checked)').button({icons: noIcon});
$('#containerId').buttonset();

Ответ 4

Оказывается, что buttonset() повторно применяет классы оформления кнопок к элементам группы, и все, что вам нужно, это обернуть сгруппированные кнопки в общий элемент... так что вы можете просто инициализировать свои кнопки, как обычно, тогда затем примените buttonet() к желаемой группе.

Это то, что я делаю (пример):

var buttons = {
   '#id1': {group:'group1', options: options1},
   '#id2': {group:'group1', options: options2},
   ....
   '#idn': {group:'group1', options: optionsN}
}
$.each(buttons, function(s,o) { $(s).addClass(o.group).button(o.options); });

$('.group1').wrapAll('<span></span>').parent().buttonset();

Конечно, все кнопки, которые должны быть сгруппированы вместе, уже смежны, но вы получаете точку. Это тоже пример!