Есть ли способ динамически изменить класс CSS кнопки? - PullRequest
Новая
       9

Есть ли способ динамически изменить класс CSS кнопки?

2 голосов
/ 05 февраля 2009

Я работаю над веб-приложением на основе Wicket. В приложении есть кнопки, которые не каждый пользователь имеет право использовать. Эти кнопки на самом деле являются простыми ссылками, например 

<a wicket:id="publishButton" title="Publish" class="rightPanel_publish"><wicket:message key="publish"/></a>

с классом CSS (из внешнего файла CSS), который устанавливает их внешний вид, например 

a.rightPanel_publish {
    display: block;
    width: 90px;
    height: 27px;
    background: url( ../imgs/right_panel_icon03.gif ) left top repeat-y;
    text-decoration: none;
    color: black;
    padding: 12px 0px 0px 35px;
}

Когда пользователь не авторизован для использования кнопки, ссылка отключена (в Java), и CSS по какой-то причине больше не используется.

Мой вопрос заключается в следующем: есть ли способ определить, что ссылка отключена во время выполнения, и изменить класс CSS? Я предпочел бы избегать использования javascript (пока что удалось сохранить весь проект без JS ...) и предпочел бы что-то, что будет работать со всеми браузерами.

Спасибо большое,

Ювал = 8 -)

Ответы [ 5 ]

3 голосов
/ 05 февраля 2009

К сожалению, я не знаю, как изменить страницу кнопки без JS. CSS, Java и все остальное работает во время загрузки страницы, после загрузки страницы единственный способ взаимодействия со страницей - через JS.

Однако вот JS, который работает в любом браузере (IE 6+, Safari, Opera, FF и т. Д.), 

  if(document.getElementById('foo'))
  {
    document.getElementById('foo').className='bar';
  }
1 голос
/ 27 июня 2012

Вы также можете изменить внешний вид кнопки (например, класс css) с помощью AttributeModifier, основываясь на состоянии аутентификации пользователя: 

myButton.add(new AttributeModifier("class", new AbstractReadOnlyModel<String>() {

        private static final long serialVersionUID= 1L;

        @Override
        public String getObject () {
            if (!isAuthorized()) {
                return "rightPanel_unauthorized";
            }
            return "rightPanel_publishbutton";
        }
    }));

В вашем CSS вы затем определяете стиль ".rightPanel_unauthorized" по мере необходимости.

1 голос
/ 21 апреля 2012

Ссылки Wicket заменяют тег на , если он отключен.

Помните об этом при применении CSS, например ::100100 

.rightPanel_publish_button {
  display: block;
  width: 90px;
  height: 27px;
  background: url( ../imgs/right_panel_icon03.gif ) left top repeat-y;
  text-decoration: none;
  color: black;
  padding: 12px 0px 0px 35px;
}
1 голос
/ 05 февраля 2009

Нет способа сделать это без какого-либо сценария. «D» в «DHTML» означает «Javascript»: P

Редактировать: На самом деле, поскольку вы говорите, что-то отключает ссылку / кнопку, что-то может / должно также добавить «отключенный» класс (единственный способ x-браузера, чтобы CSS обращал внимание) тот же элемент. Переключение во время выполнения не вступает в это - если что-то меняет состояние, оно должно делать это тщательно.

0 голосов
/ 31 января 2011

Я использую *.setVisible(Boolean boolean)

Доступно для моделей WebMarkupContainer в Wicket. SetVisible () может быть назначен в другом месте класса на основе пользовательских ролей. так что, возможно, вам придется искать это ...

...