Как заменить содержимое div новым результатом ajax в ExtJs?

Question

Я новичок в ExtJs, я хочу перезаписать html-содержимое Div id "infraTab" с новым результатом запроса Ajax.

Справка была бы принята с благодарностью. Спасибо заранее. Ниже приведен код, который я делаю до сих пор.

Ext.define('testview', { 
    layout : { 
        type: 'border', 
        padding: 5 
       }, 
    extend : 'Ext.Panel', 
    alias : 'widget.infraTab', 
    id  : 'infraTab', 
    margin : '10 10 10 10', 
    border : true, 
    items : Ext.create('Ext.view.View', { 
        store: store, 
        tpl:resultTemplate, 
        itemSelector: 'div.list-item', 
        listeners: { 
         itemclick: function(view, record, item, index, e, eOpts) { 
          getsublevels("abc"); 
         } 
        } 
      }) 
}); 

Приведенный выше код отображает данные, а также новая функция Ajax вызова

var getsublevels = function(value){ 

         var sublvlStore = Ext.create('Ext.data.Store', { 
               model : 'LevelModel', 
               autoLoad : true, 
                proxy : { 
                  type : 'ajax', 
                  url : 'Url', 
                 method :'GET', 
                 extraParams: { 
                  test: test 
                 }, 
                 reader : { 
                    type : 'json', 
                    root : 'data', 
                  totalProperty : 'total', 
                  successProperty: 'success' 
                 } 
                } 
              }); 
         sublvlStore.load(); 
         Ext.define('testview', { 
          layout : { 
              type: 'border', 
              padding: 5 
             }, 
          extend : 'Ext.Panel', 
          alias : 'widget.infraTab', 
          id  : 'infraTab', 
          margin : '10 10 10 10', 
          border : true, 
          renderTo: "infraTab", 
          items : Ext.create('Ext.view.View', { 
              store: sublvlStore, 
              tpl:resultTemplate, 
              itemSelector: 'div.list-item', 
              listeners: { 
               itemclick: function(view, record, item, index, e, eOpts) { 
                getsublevels(record.get('value')); 
               } 
              } 
            }) 
         }); 
}; 

Я попытался renderTo, но не повезло.

Answer 1

Для этого вам не нужно заменять все содержимое страницы, вид списка, который у вас есть, привязан к данным в магазине. Вы можете обновлять/изменять/перезагружать или полностью заменять данные в хранилище, и результаты будут отображаться на экране.

попробовать что-то подобное в вашем верхнем блоке

items : Ext.create('Ext.view.View', { 
    store: store, 
    tpl:resultTemplate, 
    itemSelector: 'div.list-item', 
    listeners: { 
     itemclick: function(view, record, item, index, e, eOpts) { 
      store.reload({ 
       params: { 
        parentValue: record.get('value') 
       }, 
       url: '/new_url.php' 
      }); 
     } 
    } 
}) 

кода В приведенном выше примере при выборе элемента в списке, он будет посылать АЯКС запрос на сервер трейлерах параметр, содержащий родительский список значение, на которое ваша внутренняя служба должна соответствовать другим данным, чем первый запрос.