Кнопка с меняющейся по клику иконкой (bootstrap)
Имеется кнопка подписки/отписки в профиле пользователя с иконкой:
Чуть выше прогружаютя текстовки:
Стоит задача, чтобы иконка менялась в соответствие с текущим статусом подписки.
Получается, но при подписке иконка исчезает и появляется только при перезагрузке страницы. Т.е. if-ы в классах иконки сразу не отрабатывают.
При подписке для li.follow a задется класс followed.
Это делает скрипт из user.js:
Попробовал задать для li.follow a background-image с нужными координатами в спрайте, а для li.follow a.followed соответствующий background-position. Все работает как надо. Но «рушиться» bootstrap-овская кнопка и надо верстать вручную.
Вопрос: Что необходимо дописать в скрипт выше, чтобы иконке задавался соответствующий класс (icon-plus и icon-minus)?
<li class="follow"> <a href="#" onclick="ls.user.followToggle(this, {$oUserProfile->getId()}); return false;" class="btn btn-xs btn-default"> <i class="icon{if $oUserProfile->isFollow()} icon-minus{else} icon-plus{/if}></i>{if $oUserProfile->isFollow()} {$aLang.profile_user_unfollow}{else} {$aLang.profile_user_follow}{/if} </a> </li>
Чуть выше прогружаютя текстовки:
<script> jQuery(function($){ ls.lang.load({lang_load name="profile_user_unfollow,profile_user_follow"}); }); </script>
Стоит задача, чтобы иконка менялась в соответствие с текущим статусом подписки.
Получается, но при подписке иконка исчезает и появляется только при перезагрузке страницы. Т.е. if-ы в классах иконки сразу не отрабатывают.
При подписке для li.follow a задется класс followed.
Это делает скрипт из user.js:
this.followToggle = function(obj, iUserId) { if ($(obj).hasClass('followed')) { ls.stream.unsubscribe(iUserId); $(obj).toggleClass('followed').text(ls.lang.get('profile_user_follow')); } else { ls.stream.subscribe(iUserId); $(obj).toggleClass('followed').text(ls.lang.get('profile_user_unfollow')); } return false; };
Попробовал задать для li.follow a background-image с нужными координатами в спрайте, а для li.follow a.followed соответствующий background-position. Все работает как надо. Но «рушиться» bootstrap-овская кнопка и надо верстать вручную.
Вопрос: Что необходимо дописать в скрипт выше, чтобы иконке задавался соответствующий класс (icon-plus и icon-minus)?