kurojneko
@kurojneko

Как подружить ember и jquery UI?

пытаюсь извратиться, привязав к компоненту Эмбера меню по правой кнопке. Первая же мыль, приделать готовое контекстное меню от jquery UI, но эмбер как обычно начал выпендриватся, и делать вид что ничего к нему не цепляли.
Нашел несколько примеров такого плана:
App.NodeComponent = Ember.Component.extend({
  initialize: (function() {
    this._super();
      this.$().contextmenu({
        delegate: ".hasmenu",
        menu: [
            {title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"},
            {title: "----"},
            {title: "More", children: [
                {title: "Sub 1", cmd: "sub1"},
                {title: "Sub 2", cmd: "sub1"}
                ]}
            ],
        select: function(event, ui) {
            console.log("select " + ui.cmd + " on " + ui.target.text());
        }
      });
  }).on('didInsertElement'),


Но работать такая конструкция отказывается.
Можно ли подружить эмбер с jquery UI модулями? и есть ли у эмбера альтернативное меню по правой кнопке?
  • Вопрос задан
  • 280 просмотров
Решения вопроса 1
Kaer_Morchen
@Kaer_Morchen
Разрабатываю web-приложения.
Модуль контекстного меню не использовал, но другими модулями jQuery UI постоянно.

В консоле что-нибудь выводится?

У вас есть есть ошибки в коде:
1. Название компонента состоят из двух слов минимум, а у вас из одного;
2. Название функции initialize очень стремное, замените на что-нибудь вроде contextMenuInit;
3. this._super(); соответственно выкидываем;
4. Зачем брать функцию в скобки? Может и работает, но это не по коде стайлу.

App.XNodeComponent = Ember.Component.extend({
  contextMenuInit: function() {
      this.$().contextmenu({
        delegate: ".hasmenu",
        menu: [
            {title: "Copy", cmd: "copy", uiIcon: "ui-icon-copy"},
            {title: "----"},
            {title: "More", children: [
                {title: "Sub 1", cmd: "sub1"},
                {title: "Sub 2", cmd: "sub1"}
                ]}
            ],
        select: function(event, ui) {
            console.log("select " + ui.cmd + " on " + ui.target.text());
        }
      });
  }.on('didInsertElement')
});


{{x-node}}

Вот пример с рабочим контектсным меню
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы