Size: a a a

WordPress for developers

2020 December 23

4

4occi in WordPress for developers
Есть какое-то решение, может быть я просто не знаю...
Кнопка с 3мя состояниями по клику. Сейчас реализовал через button + состояния через скрытые чекбоксы со своими value. Ну и их переключает небольшой js.
Может есть что-то более лаконичное?
источник

V

Vitalik in WordPress for developers
4occi
Есть какое-то решение, может быть я просто не знаю...
Кнопка с 3мя состояниями по клику. Сейчас реализовал через button + состояния через скрытые чекбоксы со своими value. Ну и их переключает небольшой js.
Может есть что-то более лаконичное?
Если я Вас правильно понял, то можно хранить значение в data атрибуте
источник

AN

Anatoly NM in WordPress for developers
4occi
Есть какое-то решение, может быть я просто не знаю...
Кнопка с 3мя состояниями по клику. Сейчас реализовал через button + состояния через скрытые чекбоксы со своими value. Ну и их переключает небольшой js.
Может есть что-то более лаконичное?
Код можно ?
источник

4

4occi in WordPress for developers
Anatoly NM
Код можно ?
<div class="btn-group-toggle" data-toggle="buttons" >
 <input type="radio" id="s0" name="sort" value="0"  <?php echo $s0;?> hidden>
 <input type="radio" id="s1" name="sort" value="1"  <?php echo $s1;?> hidden>
 <input type="radio" id="s2" name="sort" value="2" <?php echo $s2;?> hidden>
 <button type="button" id="toggler"  class="btn <?php echo $style;?>">Sort</button>
</div>
источник

J

Johnny in WordPress for developers
4occi
Есть какое-то решение, может быть я просто не знаю...
Кнопка с 3мя состояниями по клику. Сейчас реализовал через button + состояния через скрытые чекбоксы со своими value. Ну и их переключает небольшой js.
Может есть что-то более лаконичное?
Запишите все значения в один атрибут через разделитель, при клике раскладывайте на массив и сохраняйте активное значение в другой атрибут
источник

AN

Anatoly NM in WordPress for developers
4occi
<div class="btn-group-toggle" data-toggle="buttons" >
 <input type="radio" id="s0" name="sort" value="0"  <?php echo $s0;?> hidden>
 <input type="radio" id="s1" name="sort" value="1"  <?php echo $s1;?> hidden>
 <input type="radio" id="s2" name="sort" value="2" <?php echo $s2;?> hidden>
 <button type="button" id="toggler"  class="btn <?php echo $style;?>">Sort</button>
</div>
А пыха что вставляет ?)
источник

4

4occi in WordPress for developers
Anatoly NM
А пыха что вставляет ?)
checked
если ulr такойто  то такое то состояние кнопки в моменте при загрузке страницы
источник

AN

Anatoly NM in WordPress for developers
Начнём с того что у вас не чекбоксы а переключатели)
Во-вторых все это можно сгенерировать тогда уж на php обычным циклом. И вывести в html.

А в третих это очень странная конструкция которая порождает проблемы как в самом интерфейсе так и с UX. Зачем жать 3 раза одну кнопку когда можно поставить переключатели, чек боксы или сделать ползунок?)

Если все же необходимо чтобы у кнопки было 3 или 4 разных действия то все это можно описать скриптом повесив на кнопку обработчик событий и при каждом клике добавлять значение в атрибут data-*
источник

4

4occi in WordPress for developers
Anatoly NM
Начнём с того что у вас не чекбоксы а переключатели)
Во-вторых все это можно сгенерировать тогда уж на php обычным циклом. И вывести в html.

А в третих это очень странная конструкция которая порождает проблемы как в самом интерфейсе так и с UX. Зачем жать 3 раза одну кнопку когда можно поставить переключатели, чек боксы или сделать ползунок?)

Если все же необходимо чтобы у кнопки было 3 или 4 разных действия то все это можно описать скриптом повесив на кнопку обработчик событий и при каждом клике добавлять значение в атрибут data-*
Это сортировка - UX - 3 позиции 3 стиля (стрелочка вверх вниз)
источник

AN

Anatoly NM in WordPress for developers
4occi
Это сортировка - UX - 3 позиции 3 стиля (стрелочка вверх вниз)
window.onload = function(){
 const btn = document.querySelector(“#btn”);
 btn.dataset.clicked = 0;

 btn.addEventListener(“click”, (e)=>{
   e.preventDefault()
   btn.dataset.clicked++;

   if(btn.dataset.clicked > 3)
     btn.dataset.clicked = 0
 }
}
источник

AN

Anatoly NM in WordPress for developers
Возможно в синтаксисе ошибся с телефона не удобно писать
источник

AN

Anatoly NM in WordPress for developers
И разумеется в элемент <button> нужно добавить атрибут data-clicked
источник

4

4occi in WordPress for developers
Anatoly NM
Возможно в синтаксисе ошибся с телефона не удобно писать
Ну тогда когда у нас будет функционал сортировки с перезагрузкой страницы - это конструкция не будет работать корректно, каждый раз data-clicked=0 же
источник

AN

Anatoly NM in WordPress for developers
4occi
Ну тогда когда у нас будет функционал сортировки с перезагрузкой страницы - это конструкция не будет работать корректно, каждый раз data-clicked=0 же
localStorage, бро
источник

4

4occi in WordPress for developers
Anatoly NM
localStorage, бро
а ну.. бум пробовать, спс
источник

J

Johnny in WordPress for developers
@mihdan сэр, у вас верстка едет, сэр
источник

MK

Mikhail Kobzarev in WordPress for developers
О как спасибо, видать стили у вп нового поменялись
источник
2020 December 24

V

Vladimir in WordPress for developers
В 2009 году какая версия php в основном была на вебхостингах
источник

ZS

Zurab Shivarbidze 🇬🇪... in WordPress for developers
Vladimir
В 2009 году какая версия php в основном была на вебхостингах
Мы тогда были молоды, чтоб обращать внимание на версию, я думаю мб 5.4
источник

V

Vladimir in WordPress for developers
Как выяснилось, на то время популярны были 5.2-5.3 а 5.4 релизнули примерно в
2013
источник