2013-11-21 1 views
0

Я использую jQuery dataTables для отображения таблицы. Мне нужно иметь возможность передать событие выбора строки на мой компонент Aura, который обрабатывает выбор и выполняет некоторые операции с данными из этой строки.Получить ссылку на компонент в AuraJS

В функции initialize():

initialize: function() 
{ 
    $("#mytable tbody").click(function(event) 
    { 
     $(mytable.fnSettings().aoData).each(function() 
     { 
     $(this.nTr).removeClass('row_selected'); 
     }); 

     $(event.target.parentNode).addClass('row_selected'); 
    }); 

    mytable = $('#mytable').dataTable(); 
}, 

Я создал обработчик щелчка для выбора строки, но как я могу получить ссылку на компонент ограждающей, так что я могу sandbox.emit() функция выдавать сообщения? Я могу поместить ссылку на компонент в Closure, но это по сути делает этот компонент одиночным, и я никогда не мог иметь одновременно два экземпляра компонента на странице.

Есть ли стандартный способ, используя селектор jQuery или какой-либо другой метод, что я могу получить ссылку на охватывающий компонент изнутри обработчика click()?

Редактировать: Я никогда не должен пытаться писать код, пока у меня не было 32 унции кофеина. Вы можете передать ссылку на текущий компонент с помощью самого метода click(). Как так:

$("#mytable tbody").click(this, function(event) 
{ 
    $(mytable.fnSettings().aoData).each(function() 
    { 
    $(this.nTr).removeClass('row_selected'); 
    }); 

    $(event.target.parentNode).addClass('row_selected'); 

    event.data.sandbox.emit('mychannel', {data: 'stuff'}); 
}); 

ответ

0

Если я правильно понимаю ваш вопрос, вы можете попробовать что-то вроде этого

initialize: function() { 
    var that = this; 
    $("#mytable tbody").click(function(event) { 
     //have acces to component as 'that'  
    }); 
} 

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

View: { 
     events: { 
      'click a[data-question-edit-id]': function (e) { 
       var button = $(e.currentTarget), 
        id = button.attr('data-question-edit-id'), 
        examId = this.component.examModel.get('id'); 

       this.sandbox.router.navigate('/exams/' + examId + '/questions/' + id + '/edit', {trigger: true}); 
      }, 
      'click a[data-question-delete-id]': function (e) { 
       var button = $(e.currentTarget), 
        id = button.attr('data-question-delete-id'); 

       this.component.showDeleteConfirmation(id); 
      } 
     } 
    } 

Если вы я буду полезен, вот мой репо проекта ауры, над которым я работаю: https://github.com/lyubomyr-rudko/aura-test-project

Смежные вопросы