哈哈，找到一种方式来简单模拟EXTJS中与服务器的AJAX交互啦。
一直在测试客户端的EXTJS，但遇到服务器端就麻烦了，要建库，要写JSON,要有HTTP返回值。
今天测试了一个简单的方法，经过测试是OK了。
那，就是Python的SimpleHTTPServer模块作个简单的WEB服务器，然后，需要返回的值直接写个HTML即可啦。
指定目录的启动命令：
|
1
|
python -m SimpleHTTPServer |
如果要测试如下EXTJS的AJAX请求：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
<!DOCTYPE html>
<html>
<head>
<title>ExtJs</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link rel="stylesheet" type="text/css" href="ExtJs/packages/ext-theme-crisp/build/resources/ext-theme-crisp-all.css">
<script type="text/javascript" src="ExtJs/ext-all.js"></script>
<script type="text/javascript" src="ExtJs/bootstrap.js"></script>
<script type="text/javascript" src="ExtJs/packages/ext-theme-crisp/build/ext-theme-crisp.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.define('Person', {
extend: 'Ext.data.Model',
fields: ['name', 'age']
});
var store = Ext.create('Ext.data.Store', {
model: 'Person',
proxy: {
type: 'ajax',
url: 'source.html',
reader: {
type: 'json',
root: 'users'
}
}
});
store.load({
callback: function(records, operation, success) {
if(success) {
var msg = [];
store.each(function(person){
msg.push(person.get('name') + ' ' + person.get('age'));
});
Ext.Msg.alert('notice', msg.join('<br />'));
}
}
});
var msg = [];
store.each(function(person){
msg.push(person.get('name') + ' ' + person.get('age'));
});
Ext.Msg.alert('notice', msg.join('<br />'));
});
</script>
</head>
<body>
<div id='tpl-table1'></div>
<br>
<div id='tpl-table2'></div>
</body>
</html>
|
则可以在同级代码目录下，生成一个source.html文件，内容如下:
|
1
2
3
4
5
6
7
8
9
10
11
|
{ users:[
{name:'qeefee', age:1},
{name:'chengang', age:18},
{name:'sky', age:31},
{name:'CK', age:65},
{name:'GK', age:43},
{name:'Bone', age:15},
{name:'Tom', age:26}
]
} |
则运行效果如下：搞定！！：）