Интерфейс слайдера для управления диапазонами букв в русском алфавите — как и чем?

Question

[Леонид]

Есть такая подзадача, разработать JavaScript-интерфейс, позволяющий делить по диапазонам букв весь русский алфавит. Выглядеть это может примерно так:

т.е. в интерфейсе мы имеем возможность делить алфавит букв от А до Я на части любого размера.

Данные из этого интерфейса будут сохранятся в виде частей алфавита: 1) А-Г 2) Д-З 3) И-О 4) П-Я

Кнопка Добавить диапазон будет добавлять новый диапазон (новую часть) на слайдер.

В jQuery UI есть стандартный слайдер: jqueryui.com/slider/#range, но там всего два ползунка, мне же надо сделать так чтобы ползунки (ограничители частей диапазонов) можно было добавлять в процессе работы с интерфейсом.

Сохранять и обрабатывать всё это я буду в PHP, потому конечно же интересно еще как потом получить эти диапазоны в виде массивов в POST например.

Понимаю что такого готового решения наверняка не найти, но всё же может кто-нибудь что-нибудь из готового посоветует наиболее близкое к моей задаче?

Answer 1

[Максим Чалов]

Мне кажется, range тут не очень уместен (там не может быть больше двух точек), а удобнее сделать типа как тут: codepen.io/simeydotme/pen/AyELv

Comments

[Леонид]

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

[littleguga]

Леонид: я бы советовал написать слайдер самому.

[Максим Чалов]

Леонид: Нет, почему несколько. Если вы в код посмотрите, там не используется range, a реализован вариант, позволяющий произвольное количество точек выставить. Конечно, обработку данных это не отменяет, но вопрос интерфейса может позволить решить без особых хлопот.