使用Sencha從JSON創建ListView

我剛剛開始使用Architect使用Sencha Touch進行遊戲，我試圖從MySQL數據庫中使用PHP填充到JSON列表。我讓建築師做腳本生成，但我似乎無法讓它在運行時填充/顯示數據。我相信我錯過了一些幫助將不勝感激。以下是支持的代碼片段。使用Sencha從JSON創建ListView

所服務的PHP：

<?php//MySQL Database Connect 
include 'andaerologin.php'; 


mysql_select_db("andaero"); 
$sql = mysql_query("select * from regulatory_list"); 


$output = array(); 
/* used "key" as name */ 
$output['listTitle'] = 'Regulatory_Guidance_Library'; 
$output['targetKey'] = 'bodyContent'; 


while ($row = mysql_fetch_assoc($sql)) { 
    $output['items'][] = $row; 
} 


header('Cache-Control: no-cache, must-revalidate'); 
header('Content-type: application/json'); 
echo(json_encode($output)); 


mysql_close(); 
?>

自動生成的app.js：

Ext.Loader.setConfig({ 
    enabled: true 
}); 


Ext.application({ 
    models: [ 
     'ListDefaultModel' 
    ], 
    stores: [ 
     'ACListStore' 
    ], 
    views: [ 
     'ViewPort' 
    ], 
    name: 'MyApp', 


    launch: function() { 


     Ext.create('MyApp.view.ViewPort', {fullscreen: true}); 
    } 


});

生成的模型（ListDefaultModel.js）：

Ext.define('MyApp.model.ListDefaultModel', { 
    extend: 'Ext.data.Model', 
    config: { 
     idProperty: 'listDefaultModel', 
     fields: [ 
      { 
       allowNull: false, 
       name: 'label', 
       type: 'string' 
      }, 
      { 
       name: 'title', 
       type: 'string' 
      }, 
      { 
       name: 'discription', 
       type: 'string' 
      } 
     ] 
    } 
});

的商店（ACListStore）：

Ext.define('MyApp.store.ACListStore', { 
    extend: 'Ext.data.Store', 
    requires: [ 
     'MyApp.model.ListDefaultModel' 
    ], 


    config: { 
     model: 'MyApp.model.ListDefaultModel', 
     storeId: 'ACListStore', 
     proxy: { 
      type: 'ajax', 
      url: 'http://192.168.1.34/andaero/php/regulatory_list.php', 
      reader: { 
       type: 'json', 
       rootProperty: 'items' 
      } 
     } 
    } 
});

的ViewPort.js內的列表容器：

. . . 
xtype: 'list', 
cls: [ 
     'list-Container' 
     ], 
     itemTpl: [ 
       '<div>', 
       '<h1>label {script}</h1>', 
       '<h2>title {script}</h2>', 
       '<p>description {script}</p>', 
       '<hr/>', 
       '</div>' 
     ], 
      scrollToTopOnRefresh: false, 
      grouped: true 
. . .

來源

2012-04-20 CelticParser

不是在你的意見的數據存儲，你可以做以下

... 
xtype: 'list' 
cls: ['list-Container'], 
store: MyApp.store.ACListStore 
itemTpl:'....' 
...

來源

2012-04-20 09:46:48

使用Sencha從JSON創建ListView

回答

相關問題