ajax代理Proxy初步理解

這次只是初步瞭解Proxy，分析一個執行個體

我們先看一下一個js檔案：proxy.js

 (function(){<span style="white-space:pre"></span> Ext.onReady(function(){ <span style="white-space:pre"></span>Ext.define("person",{    extend: 'Ext.data.Model',     fields: [        {name: 'name', type: 'auto'},        {name: 'age',  type: 'int'},        {name: 'email',type: 'auto'}    ],    proxy:{ <span style="white-space:pre"></span>type:'ajax', <span style="white-space:pre"></span>url:'proxy.jsp'    } <span style="white-space:pre"></span>}); <span style="white-space:pre"></span> var p = Ext.ModelManager.getModel('person');    p.load(1, {    scope: this,    failure: function(record, operation) {        //do something if the load failed    },    success: function(record, operation) {        //do something if the load succeeded    <span style="white-space:pre"></span>alert(record.data.name);    },     callback: function(record, operation) {        //do something whether the load succeeded or failed   }});<span style="white-space:pre"></span> }) })();

然後再看看一個jsp檔案：Proxy.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%response.getWriter().write("{name:'uppcat.com'，age:16,email:"wfc@163.com"}");%> 

這個JSP實際上是為前台提供資料的，這些資料可能是直接寫的JSON字串，也可能是從資料庫中取出來的值。一定要注意他的書寫格式。

在前台頁面的時候載入proxy.js

<script type="text/javascript" src="proxy.js">    </script>

分析，proxy.js分為了三個部分：1）建立一個person類

Ext.define("person",{

2）類的執行個體：  var p = Ext.ModelManager.getModel('person');

3）建立執行個體後調用load()方法

  var p = Ext.ModelManager.getModel('person');

我們看看這個函數load()：

 p.load(1, {
    scope: this,
    failure: function(record, operation) {
        //do something if the load failed
    },
    success: function(record, operation) {
        //do something if the load succeeded
    alert(record.data.age);
    },
     callback: function(record, operation) {
        //do something whether the load succeeded or failed
   }

我們根據

Model建立類，然後我們用Ext.ModelManager.getModel('person');建立對應的執行個體，，查看Model類，用其中的load()方法來顯示資料

這個load有點意思：我們可能不理解recod是什麼東西，或者其它函數什麼內容，這個時候就要學會在瀏覽器中debug

以後我們就可以在js中負責擷取資料OK了，