Ext.grid.Panel加載JSON數據

Ext.onReady(function ()
{
    //建立一個store要使用的Model
    Ext.define("User", {
        extend: "Ext.data.Model",
        fields: [
            { name: "firstName", type: "string" },
            { name: "lastName", type: "string" },
            { name: "age", type: "int" },
            { name: "eyeColor", type: "string" }
        ]
    });
    var myStore = Ext.create("Ext.data.Store", {
        model: "User",
        proxy: {
            type: "ajax",
            url: "/Json/users.json",
            reader: {
                type: "json",
                root: "users"
            }
        },
        autoLoad: true
    });
    //創建Ext.grid.Panel組件
    Ext.create("Ext.grid.Panel", {
        title: "Simple Load Json Data",
        store: myStore,
        columns: [
            { header: "FirstName", dataIndex: "firstName" },
            { header: "LastName", dataIndex: "lastName" },
            { header: "Age", dataIndex: "age" },
            { header: "EyeColor", dataIndex: "eyeColor" }
        ],
        height: 300,
        width: 400,
        renderTo: Ext.getBody()
    });
});

users.json代碼如下:

{
    "users": [
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" },
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" },
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" },
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" },
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" },
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" },
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" },
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" },
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" },
               { "firstName": "Lisa", "lastName": "[email protected]", "age": 25,"eyeColor": "Yellow" }
             
            ]
 }


發佈了143 篇原創文章 · 獲贊 96 · 訪問量 33萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章