Как я могу внедрить средство выбора меток в стиле gmail? - PullRequest
3 голосов
/ 26 февраля 2009

Какой самый простой способ реализовать (что-то вроде) интерфейс Gmail для маркировки сообщений? Есть ли в библиотеке javascript такой виджет?

http://img294.imageshack.us/img294/7097/36698396.png

Поведение:

  1. Щелкните ярлык в раскрывающемся списке, чтобы сразу же пометить сообщение.
  2. Проверьте несколько меток и затем «Применить», чтобы добавить несколько меток (не уверен, что мне нравится требование «Применить» ...)
  3. Введите текст в поле, чтобы сузить список ярлыков. Если вы сузите его до 1, нажмите Enter, чтобы применить эту метку.
  4. Запустить виджет с помощью сочетания клавиш "L".

Ответы [ 3 ]

4 голосов
/ 27 февраля 2009

Гораций - вы хотите что-то действительно сложное, и вы должны принять во внимание, что даже с большим количеством готовых компонентов потребуется некоторое время, чтобы что-то вроде этого заработало (не говоря уже о том, чтобы быть симпатичным :-)) .

Как бы то ни было, готовые компоненты хороши, но я часто люблю их взламывать, как в свободном стиле. Итак, вот что я приготовил, чтобы вы начали: Моя простая демонстрационная метка ( предупреждение - я проверял это только в Firefox 3, и я уверен, что это не сработает ни в чем другом ).

Это далеко не красиво, но код довольно прост и должен быть легок для понимания.

1 голос
/ 23 сентября 2009

Я искал похожую реализацию метки и наткнулся на эту тему.

Я не могу добавить к JS часть вопроса, но с точки зрения «красивости» надписей, вам может пригодиться следующая статья / код:

CSS Gmail-подобные ярлыки

Всего наилучшего!

1 голос
/ 27 февраля 2009

Я сомневаюсь, что есть готовое решение, которое делает точно , что вы хотите, но вы должны быть в состоянии собрать что-то вместе с приличной библиотекой JavaScript. Для этого идеально подойдет что-то вроде Ext JS .

Несколько страниц API, представляющих потенциальный интерес:

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...