Обновление одного окна на события в другом окне с ExtJS

Question

Некоторое время назад я начал изучение библиотеки ExtJS и теперь я хотел бы создать следующее:

Существует окно браузера и отделена verticaly.
Слева находится TreePanel с каталогами и подкаталогами (всего 2 уровня).
С правой стороны будет выход для содержимого выбранного подкаталога.

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

Кстати. Как я сказал, левая сторона - TreePanel, а правая сторона - GripPanel, и они находятся в Viewport с xtype: «панель», но я не думаю, что это нереально для этого вопроса.

Любые предложения?

Answer 1

Во-первых, вам нужно зарегистрировать факт пользователь выбирает узел в TreePanel, это может быть сделано с помощью:

yourtreepanel.getSelectionModel().on('selectionchange', whattodonext); 

Где yourtreepanel 'имя вашего TreePanel (если TreePanel был назначается переменной, в противном случае используется Ext.getCmp ('yourtreepanel'). getSelecti ....) и 'whattodonext' - это имя вызываемой функции, когда пользователь удаляет узел.

Функция «whattodonext» будет выглядеть следующим образом:

function whattodonext(){ 
     node=yourtreepanel.selModel.selNode; 
     if(node){ 
      if(node.isLeaf()){ 
// this works out what you want to do if the user has selected a valid leaf node 


      }else{ 
// otherwise...put anything you wish to happen here (i.e. if a folder has been selected) 

      } 

     } 
    } 

Следующая часть, чтобы обновить панель справа с содержанием (если это называли «mycontentpanel»). Скажем, это содержание должно быть загружено из «mycontent.html», в разделе с

// this works out what you want to do if the user has selected a valid leaf node 

Вы бы поставил код:

mycontentpanel.load({ 
url: 'mycontent.html', 
params: { 
yourparam1:'param1value', 
yourparam2:'param2value' 
}, 
nocache: true, 
timeout: 30 
}); 

Вот и все!

Вы можете использовать параметры параметров для отправки каких-либо определенных параметров POST, которые могут быть у вас, которые будут решать, какой контент будет обслуживаться.

И не забывайте, что если вы бежите, чтобы трудности, попробуйте ссылки на свои объекты, используя Ext.getCmp («ObjectName») вместо того, чтобы просто «objectname'.operation ....

Удачи!