struts extjs 3.3.1 读取JSON文件

浏览数：70 / 时间：2015年06月09日

json文件和脚本代码:

jsonSrc/jsonTxt1.json,

{
    "personInfoList": [
        {
            "id": 0,
            "name": "A",
            "age": 12
        },
        {
            "id": 1,
            "name": "B",
            "age": 32
        },
        {
            "id": 2,
            "name": "C",
            "age": 2
        }
    ]
}

extJS3.3/test4.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>test4.html</title>
    <link rel="stylesheet" type="text/css" href="../ext-3.3.1/resources/css/ext-all.css"></link>
	<script type="text/javascript" src="../ext-3.3.1/adapter/ext/ext-base.js"></script>
	<script type="text/javascript" src="../ext-3.3.1/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function(){

    var myStore = new Ext.data.JsonStore({
    url: ‘../jsonSrc/jsonTxt1.json‘,
    root: ‘personInfoList‘,
    autoLoad: true,
    fields: [{name: ‘id‘,   type: ‘int‘},
        {name: ‘name‘,  type: ‘string‘},
        {name: ‘age‘,  type: ‘int‘}]
    });

    var columns = new Ext.grid.ColumnModel({
        columns: [
            {   
            	header: ‘ID‘,
                dataIndex: ‘id‘
            },
            {
                header: ‘Name‘,
                dataIndex: ‘name‘
            },
            {
                header: ‘Age‘,
                dataIndex: ‘age‘
            }
        ]
    });
    
    var grid = new Ext.grid.GridPanel({
        id: ‘gridPanel‘,
        title     : ‘Person Info Panel‘,
        width     : 250,
        height    : 250,
        renderTo  : ‘personInfoListPanel‘,
        store     : myStore,
        colModel  : columns         
    });    
});
</script>

  </head>
  
  <body>
    <div id = "personInfoListPanel"></div>
  </body>
</html>

郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。

struts extjs 3.3.1 读取JSON文件