EXTJS MYSQL交互总结

1建立数据表

CREATE TABLE `login` (
  `id` int(11) NOT NULL,
  `name` varchar(20) NOT NULL,
  `password` varchar(20) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

insert into login values
('1','hong','1234'),
('2','linxiang','1234'),
('3','chen','99a9s'),
('4','luxi','aabe2');

 2建立jsonreader.html视图文件，jsonreader.html调用json.js

    注册
    "Content-Type" content="text/html; charset=utf-8"/>
    "stylesheet" type="text/css" href="/ext/resources/css/ext-all.css"/>
    "text/javascript" src="/ext/adapter/ext/ext-base.js">
    "text/javascript" src="/ext/ext-all.js">
    "text/javascript" src="json.js">


'grid'>

  

  

  

3json.js 构建extjs的界面，将界面与前台视图关联(id=grid) 动态数据与后台getData.php关联.关键所在

Ext.onReady(function() {
    store=new Ext.data.JsonStore({
        url:'getData.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}
    ]
})
});

 4后台查询从数据库取数据

$conn = mysql_connect("localhost", "root", "*****");
mysql_select_db("test");
$sql = "select id,name,password from login";
$result = mysql_query($sql, $conn);

while ($row = mysql_fetch_array($result)) {
    $arr4[] = $row;
}
echo json_encode($arr4);
?>

5运行http://localhost/jsonreader.html

关于引用ext的js,css报错问题Unknown: Failed opening required '/var/www/html/deploy/js.php'

删除ext目录下面的.htaccess文件