Мультиселект
Вот сталкнулся с такой задачкой по дизайну. нужен мультиселект.
в ID1 много элементов например тыща разных характеристик объекта.
в ID2 характеристики конкретного объекта
нужно дать юзеру «юзабильно» заполнить хар-ки конкретного объекта выбрав их из общего списка или добавить свою новую характеристику.
хотелось бы посмотреть предложения оптимальные. ну и собственно есть свое попозже выложу как сейчас это работает
в ID1 много элементов например тыща разных характеристик объекта.
в ID2 характеристики конкретного объекта
нужно дать юзеру «юзабильно» заполнить хар-ки конкретного объекта выбрав их из общего списка или добавить свою новую характеристику.
хотелось бы посмотреть предложения оптимальные. ну и собственно есть свое попозже выложу как сейчас это работает
52 комментария
Чесно говоря я не уверен что до конца правильно понял задумку, но судя по всему имелось ввиду примерно следущее:
В таком случае нужно еще в предложенном в топике варианте предусмотреть стрелку «ремув», а также при перемещении строк из одного списка в другой, удалять перемещеный айтем из источника, чтобы его нельзя было перенести еще раз и он не мешал выбирать другие. Ну и как то предусмотреть добавление новых айтемов.
Но мне такое не очень нравится, я бы предпочел просто открытие диалога с мультиселекткомбобоксом, отбирающим фокус у основного окна. В котором общим списком показаны все возможные варианты, но выбранные отмечены галочкой.
Который выглядел бы примерно так (кусок интерфейса гмыла):
А внизу диалога добавить кнопку, открывающую еще один диалог забирающий фокус на себя с полем для ввода нового айтема, в случае если нужно добавить новую характеристику.
Ну а в основном окне выводится только список выбранных айтемов и кнопка открывающая диалог их редактирования.
А вот если все кому не лень могут редактировать список айтемов, то может понадобиться работа модератора.
Но можно сделать в базе словать синонимов или автозамен, чтобы упростить и ускорить работу модераторов.
Самый примитивный вариант: пусть у нас есть таблица в БД в ней только id и название характеристики. Добавим к ней еще одну колонку link ссылка, по умолчанию равную NULL. Предполагаем что все id у нас больше 0.
Для примера пусть у нас будет такая таблица с данными:
0 означают категории и слово для замены в списке функций при выборе выводятся только они (выборка WHERE link=0).
цифры означают id на какой надо заменять данную характеристику, например пользователь вбил «телек» до одобрения модератором категории «телевизор», но после создания этой категории и отнесения в нее «телек» в выдаче нужно будет выводить «телевизор» вместо «телека».
Причем если пользователь еще раз попытается добавить «телек», то посоветовать ему выбрать категорию «телевизор»
Там где стоит NULL — это категории добавлены после последнего визита модератора. Модератор заходит, ему выводятся вновь добавленные категории (выборка WHERE link=NULL) он приписывает им замену уже существующим категориям, таким образом сплитсистеме запишется 1, а ТВ — 3.
Если пользователь при добавлении характеристики вбил уже существующую, то ему надо предложить выбрать название уже существующей.
Ну и естественно понадобится интерфес управления всеми этими категориями для модератора, закрытый от пользователя. Там удалить, перенести, заменить.
Ну вверху типа название и кнопка редактировать или рисунок с шестеренкой и ключом
Так мы видим что уже есть и не отвлекаемся на остальное
Но ходим добавить чтонибудь нажимаем на редактировать получаем диалог поверх окна:
Нажмем кнопку дополнить, получим диалог с добавлением новой характеристики:
Написали название, нажали «ОК», если такое название (или категория-синоним как я уже писал выше) уже есть, то вернуться к предыдущему диалогу перейти к этому полю и допустим выделить его цветом, иначе добавить новую характеристику и тоже перейти к ней, выделив ее цветом — пользователь еще раз подумает отмечать ему ее или нет.
чтобы упростить поиск можно добавить автодополнение, только учитывать не только названия, но и синонимы
что-то типа
все в один клик делается.
Раньше скрывал Add New и только если фильтр ничего не выдавал — показывал его.
Но решил всегда показывать для удобства.
Если мы добавляем новый пункт который уже есть в списке справа то лишь справа от [+] на секунду вылезет серенький текст типа добавили из списка. и справа пункт исчезнет. фильтр делает выборку при чем по сочетанию букв в любой части слова а не автокомплит
почему я решил отказаться от одного поля фильтр/добавить.
например в базе характеристик есть washerdish а нужно добавить washer
а в остальном у меня логика 1 в 1.
Слева это как бы наша основная база характеристик а справа база текущего объекта
соответственно добавлять в основную ничего нельзя. добавлять он должен в свою и только после сохранения она перейдет в основную, так я посчитал будет логичней. а удалять позиции можно из текущей соответственно если он удаляет ту которая есть в оснавной то она возвращается назад, а ту которую он добавил и удалил значит она нахер не нужна и идет в жопу
Просто если этим надо будет воспользвоваться всего 1-2 раза, то некоторые пользователи смогут не осилить (((
Возможно, если бы рассказали суть, мы бы пидумали решение, как обойтись без этого модуля. Пока контекст неизвестен.
Если же строгие вхождения не важны, то неясно, почему нельзя выбросить эти громоздкие «мультиселекты» и использовать простое текстовое поле для свободного описания либо что-то вроде меток с автокомплитом и группировкой родственных меток в результатах поиска для коррекции разночтений. Для обеих ситуаций разрабатываемое решение лично мне представляется нерациональной полумерой, извини уж за занудство и субъективизм.
Упомянутый вариант с метками используется в обновлённой версии этого сайта для формирования собственной навигации по сайту, индивидуальной для каждого пользователя. В апреле, надеюсь, дойдут руки до обновления и можно будет посмотреть живой пример реализации. Что-то похожее используется на dirty, но там нет группировки и персонализации.
Свободное создание свойств менеджерами создаст предпосылки для возникновения хаоса, поскольку эти люди не склонны следовать соглашениям об именовании и могут называть одно и то же по-разному, что будет вносить путаницу и создаст ненужные сложности, если в дальнейшем потребуется организовать поиск или фильтрацию по этим полям.
На мой взгляд, прежде чем раздумывать над интерфейсом, нужно решить обозначенные проблемы. Всякое проектирование начинается с архитектуры приложения.
Менеджер, добавляя объект, выбирает номенклатурную группу (профиль, категорию — как угодно можно называть), после чего ему показывают список возможных свойств, которые могут принадлежать объекту только из определённой группы, не показывая лишнего. Далее, у тебя форма добавления реализована в виде модального окна, что является серьёзной проектной ошибкой. Не вдаваясь в истинное предназначение модальных окон и прочую теорию, можно легко заметить, что искусственное ограничение пространства не выглядит уместным там, где предполагается скролл и большое количество элементов, которые потребуется выбирать. Очевидно, что диалогу редактирования свойств объекта нужно отдать весь экран.
Насколько я понял, пустое поле в центре — это место для перетаскивания свойств (надеюсь, ты используешь очевидный в этом случае drag-n-drop?). На мой взгляд, источник (библиотеку свойств) и цель нужно поменять местами, привычное направление чтения для европейца — слева направо. Группу свойств, которая стоит слева, лучше вынести в другое место, например поставить над интерфейсом добавления свойств.
И ещё поправочка — это не мультиселект, в мультиселекте видны сразу все возможные варианты для выбора, сам выбор осуществляется прямо в списке без внешнего контекста, как у тебя и содержимое мультиселекта редактировать нельзя. Вероятно, ты использовал jquery плагин с одноимённым названием, но истрически мультиселектом всегда называли вот это
Все верно только плагин я не использовал, сделал надстройку над стандартным в которой получается что правая часть это набор всех а левая в итоге при сабмите отдается элемент формы select просто формируется он вот таким хитрым способом для удобства.
про поменять местами я тоже изначально сделал наоборот но почему то многие клиенты стали жаловаться что типа так им удобней и привычней. не знаю с чем связано.
Тут кстати целых 2 мультиселекта ) вот второй
но это уже от jQuery UI
Или при публикации объявления?
Т.е. Когда квартиры уже найдены и их много, надо сужать выдачу с помощью фильтра. Возможно сужение и не потребуется. Причем человеку часто важен один-два параметра (например наличие телевизора и джакузи) и уж точно не десятки.