Extjs uses jsp to pass the data example on pages, extjsjsp

Extjs uses jsp to pass the data example on pages, extjsjsp

Ext. onReady (function () {store3 = new Ext. data. jsonStore ({autoDestroy: true, totalProperty: 'totle', url: 'service. do ', storeId: 'mystore', root: 'data', fields: ['id', "name", "pw"]}); var pagingToolbar = new Ext. pagingToolbar ({emptyMsg: "No data", displayInfo: true, displayMsg: "displays {2} pieces of data from {0} to {1} pieces of data ", store: store3, pageSize: 50}); var grade = new Ext. grid. gridPanel ({title: "data list", store: store3, height: 300, bbar: pagingToolbar, columns: [{header: "id", dataIndex: "id", width: 300 },{ header: "name", dataIndex: "name", width: 300 },{ header: "pw", dataIndex: "pw"}], region: 'center'}); var panel = new Ext. viewport ({layout: 'border', items: [grade]}) ;});

Action ********************

protected void service(HttpServletRequest request,HttpServletResponse response) throws ServletException, IOException {List list = new ArrayList();for (int i = 0; i < 50; i++) {Person p = new Person();p.setId("id" + i);p.setName("name" + i);p.setPw("pw" + i);list.add(p);}StringBuffer info = new StringBuffer();info.append("{totle:2000,data:");info.append(JSONArray.fromObject(list));info.append("}");System.out.println(info.toString());System.out.println("*****doPos");request.setAttribute("info", info.toString());request.getRequestDispatcher("/info.jsp").forward(request, response);}

Info. jsp ************* Note: jsp cannot contain any text except @ page.

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"pageEncoding="ISO-8859-1"%>${info}

Web. xml ***************

<?xml version="1.0" encoding="UTF-8"?><web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"id="WebApp_ID" version="2.5"><servlet><servlet-name>test</servlet-name><servlet-class>com.aa.TestAction</servlet-class></servlet><servlet-mapping><servlet-name>test</servlet-name><url-pattern>*.do</url-pattern></servlet-mapping><welcome-file-list><welcome-file>index.jsp</welcome-file></welcome-file-list></web-app>

ExtJs reads background data for paging?

OStore = new Ext. data. JsonStore ({
Url: '/backend/getdata', // This is the background
Root: 'data ',
TotalProperty: 'Total', // total number of records in total
RemoteSort: true,
Fields: [// What are the specific fields?
'Field1 ',
'Field2 ',
......
]
});
Var selModel = new Ext. grid. CheckboxSelectionModel ();
Var colModel = new Ext. grid. ColumnModel ([selModel ,{
// Table column Definition
......
]);

OGrid = new Ext. grid. GridPanel ({
Title: 'title ',
IconCls: 'icon _ XXX', // icon
Ds: oStore,
Cm: colModel,
Sm: selModel,
LoadMask :{
Msg: 'loading ...'
},
Tbar: [{// header Toolbar
Text: 'button 1 ',
IconCls: 'icon-fileup ',
Tooltip: 'Action of Button 1 ',
Handler: function (btn, e ){
//
}
}],
Bbar: new Ext. PagingToolbar (// tool bar at the bottom (implemented here by page)
Store: oStore,
PageSize: 30, // number of records displayed per page
DisplayInfo: true,
Plugins: [new Ext. ux. PageSizePlugin ()], // This is a plug-in. Find it online
EmptyMsg: "No data"
}),
Listeners :{
Render: function (){
// Load homepage data
OStore. load ({params: {start: 0, limit: 30 }});
}
}
});

The data returned by/backend/getdata is like this.
{
Data: [...],
Total: 100
}

How does java extjs transfer and accept page values?

There is no relationship between passing parameters in extjs and using any language for background processing. Use the following method to pass the value in the past, and then use the method of receiving parameters in the corresponding language to normally receive the value,
1. ajax method:
Ext. Ajax. request ({
Url: 'doaction. jsp? Method = add ',
Params: {UserName: 'zhang san', Gender: 'mal'}, // parameter list
Callback: function (options, success, response) {// callback function
If (success ){
Alert (response. responseText); // return data
}
}
})
2. form pass Value
Defines an Ext. form. FormPanel)
Var ItemForm = new Ext. form. FormPanel ({.....})
Use ItemForm. getForm (). submit to submit the form:
ItemForm. getForm (). submit ({
WaitMsg: 'saving the data. Please wait ...',
WaitTitle: 'hs ',
Method: 'post ',
Url: 'dataaction. jsp? Method = save ',
Params: {UserName: 'zhangsan', Gender: 'male '},
Success: function (form, action ){
// Do something here
},
Failure: function (form, action ){
Ext. Msg. alert ('hprompt ',' failed to save. ');
}
})