close

先利用get.php這個網頁取得資料庫裡的資料

get.php

<?php
    $conn=mysql_connect("localhost","dbname","passwd");
    mysql_select_db("dbname");
    $sql="select id,name,password from login";
    $result=mysql_query($sql,$conn);
    
    while($row=mysql_fetch_array($result))
    {
        $arr4[]=$row;
    }
    echo json_encode($arr4);
?>

之後再使用json.js到get.php這個頁面取得所需的欄位

json.js

Ext.onReady(function() {
    store=new Ext.data.JsonStore({
        url:'get.php',
        data:[],
        fields:[
            {name:'id'},
            {name:'name'},
            {name:'password'}
        ]
    });
    store.load();
    new Ext.grid.GridPanel({
        store:store,
        mode:'remote',
        title:'简单Grid表格示例',
        applyTo:'grid',
        width:250,
        height:150,
        frame:true,
        columns:[
            {header:"id",width:50,dataIndex:'id',sortable:true},
            {header:"姓名",width:80,dataIndex:'name',sortable:true},
            {header:"年齡",width:80,dataIndex:'password',sortable:true}
        ]
    })
});

再利用jsonreader.php給展現出來

jsonreader.php

<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="../ext-3.2.1/resources/css/ext-all.css" />
<script type="text/javascript" src="../ext-3.2.1/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext-3.2.1/ext-all.js"></script>
    <script type="text/javascript" src="json.js"></script>
</head>
<body>
    <div id='grid'></div>
</body>
</html>

 

arrow
arrow
    全站熱搜

    塵封等待 發表在 痞客邦 留言(0) 人氣()