An initial understanding of Ajax proxy Proxies

This is just a preliminary understanding of proxy, analysis of an example

Let's look at a JS file first: 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 sty le= "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) {    &N Bsp  //do Something if the load failed    },     success:function (recoRd, Operation) {       //do something if the load succeeded     <span style= "White-spac
E:pre "> </span>alert (record.data.name);          callback:function (record, operation) {       //do something WH
Ether the load succeeded or failed    }); <span style= "White-space:pre" > </span>})  }) ();

Then look at a JSP file: proxy.jsp

<%@ page language= "java" import= "java.util.*" pageencoding= "UTF-8"%>
<% response.getwriter
(). Write ("{name: ' uppcat.com ', Age:16,email:" Wfc@163.com "}");
%>

 

This JSP actually provides data for the foreground, which can be either a JSON string for direct writing or a value taken out of the database. Be sure to pay attention to his writing format.

Load Proxy.js on the front page

<script type= "Text/javascript" src= "Proxy.js" >
    </script>

Analysis, Proxy.js is divided into three sections: 1) Create a person class

Ext.define ("person", {

2) Examples of classes: var p = Ext.ModelManager.getModel (' person ');

3) Call the Load () method after creating the instance

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

Let's take a look at this function 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
}

We based

Model creates the class, and then we use Ext.ModelManager.getModel (' person '), create the corresponding instance, view the model class, and use the load () method to display the data

This load is a bit of a point: we may not understand what recod is, or what other functions are, and we need to learn to debug in the browser.

In the future we can be in JS in charge of obtaining data OK,