码迷,mamicode.com
首页 > Web开发 > 详细

struts extjs 3.3.1 读取JSON文件

时间:2014-10-23 12:31:00      阅读:231      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   io   ar   java   文件   div   2014   

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文件

标签:style   blog   http   io   ar   java   文件   div   2014   

原文地址:http://blog.csdn.net/hjm4702192/article/details/40393743

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!