2013-05-25 50 views
0

我在ExtJS腳本中有一個AJAX調用,但我不知道如何獲取返回的JSON對象並將其分配給一個變量以供在頁面上使用。我基本上採取硬編碼的extJS腳本,並從數據庫中放入JSON。以下是我需要做的ExtJS AJAX返回的JSON對象

要收到這個AJAX調用一個變量:

Ext.onReady(function() { 
Ext.Ajax.request({ 
url: '/xxx/clienttool/components/Client-Tool.cfc?method=getResources&returnformat=json', 
params: { 
accountID: 463 
}, 
success: function(response){ 
var text = response.responseText; 
// process server response here 
} 

});

,併爲其分配等等,這些值沒有硬編碼:

// Store holding all the resources 
     resourceStore  : Ext.create("Sch.data.ResourceStore", { 
      model : 'Sch.model.Resource', 
      data : [ 
       {Id : 'MadMike', Name : 'Mike'}, 
       {Id : 'JakeTheSnake', Name : 'Jake'}, 
       {Id : 'KingFu', Name : 'King'}, 
       {Id : 'BeerBrian', Name : 'Brian'}, 
       {Id : 'LindaAnderson', Name : 'Linda'}, 
       {Id : 'DonJohnson', Name : 'Don'}, 
       {Id : 'KarenJohnson', Name : 'Karen'}, 
       {Id : 'DougHendricks', Name : 'Doug'}, 
       {Id : 'PeterPan', Name : 'Peter'} 
      ] 
     }), 

這裏的整個事情:

Ext.onReady(function() { 

    App.SchedulerDemo.init(); 
}); 

App.SchedulerDemo = { 

// Initialize application 
init : function() { 
    Ext.define('Event', { 
     extend : 'Sch.model.Event', 
     fields : [ 
      {name : 'Title'}, 
      {name : 'Type'} 
     ] 
    }); 


    //ajax call to get resources for this accountID 
    Ext.Ajax.request({ 
     url: '/xxxx/clienttool/components/Client-Tool.cfc?method=getResources&returnformat=json', 
     params: { 
     accountID: 463 
     }, 
     success: function(response){ 
      getResources = response.responseText; 
     // process server response here 
     } 
    }); 
    //alert(getResources); 

    var zoneStore = Ext.create('Ext.data.JsonStore', { 
     model : 'Sch.model.Range', 
     data : [ 
      { 
       // Nice 2 hour lunch 
       StartDate : new Date(2011, 11, 9, 12), 
       EndDate : new Date(2011, 11, 9, 14), 
       Cls  : 'lunch-style' 
      } 
     ] 
    }); 

    var sched = Ext.create("Sch.panel.SchedulerGrid", { 
     height     : ExampleDefaults.height, 
     width     : ExampleDefaults.width, 
     rowHeight    : 40, 
     eventBarTextField  : 'Title', 
     viewPreset    : 'hourAndDay', 
     startDate    : new Date(2011, 11, 9, 7), 
     endDate     : new Date(2011, 11, 9, 20), 
     orientation    : 'vertical', 
     constrainDragToResource : false, 
     eventBarIconClsField : 'Type', 
     snapToIncrement   : true, 
     //constrainDragToResource : true, 
     eventResizeHandles  : 'end', 

     viewConfig : { 
      // Experimental for CSS3 enabled browsers only 
      eventAnimations : true 
     }, 

     // Store holding all the resources 
     resourceStore  : Ext.create("Sch.data.ResourceStore", { 
      model : 'Sch.model.Resource', 
      data : 
      [ 
       {Id : 'MadMike', Name : 'Mike'}, 
       {Id : 'JakeTheSnake', Name : 'Jake'}, 
       {Id : 'KingFu', Name : 'King'}, 
       {Id : 'BeerBrian', Name : 'Brian'}, 
       {Id : 'LindaAnderson', Name : 'Linda'}, 
       {Id : 'DonJohnson', Name : 'Don'}, 
       {Id : 'KarenJohnson', Name : 'Karen'}, 
       {Id : 'DougHendricks', Name : 'Doug'}, 
       {Id : 'PeterPan', Name : 'Peter'} 
      ] 

     }), 

回答

0

如果AJAX請求的唯一目的是檢索網格的存儲數據,我會完全拋棄它,只需在您的商店中定義AJAX proxy即可。它不僅會完成相同的初始目標(例如,爲您的商店獲取數據),還會處理創建數據的模型實例並將商店綁定到您的網格。

我建議檢查出docs for the Store,以及grid examples在文檔中。