1. 테이블을 보여주세요
http://img.blog.csdn.net/20140662213941015?watermark/2/text/ahr0cdovl2jsb2cuy3nkbi5uzxqvy wrhbv93enm =/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma ==/dissolve/70/gravity/southeast <%@ page language = "java"import = "java.util.*"pageencoding = "utf-8"%> <! doctype html public "-// w3c // dtd html 4.01 transitional // en"> <html> <head> <title> my jsp 'index.jsp'시작 페이지 <stylesheet = " href = "./ extjs4.1/resources/css/ext-all.css"> <script type = "text/javaScript"src = "./ extjs4.1/ext-all-debug.js"> </script> <script type = "text/javaScript" src = "./ extjs4.1/locale/ext-lang-zh_cn.js"> </script> <script type = "text/javaScript"> ext.onready (function () {// 테이블 정의 var grid = new ext.grid.grid.panel ({{text : 'line number'}) {text : 'class'}, {텍스트 : '중국어'}, {텍스트 : '수학'}, {text : 'English'}]}); // show show show window.show (); }); </script> </head> <bod> 쇼 테이블 <br> </body> </html>2. 로컬 데이터 표시
<%@ page language = "java"import = "java.util.*"pageEncoding = "utf-8"%> <! doctype html public "-// w3c // dtd html 4.01 Transitional // en"> <html> <head> <title> my jsp 'index.jsp'시작 페이지 ""링크 rel " type = "text/css"href = "./ extjs4.1/resources/css/ext-all.css"> <script type = "text/javaScript"src = "./ extjs4.1/ext-all-debug.js"> </script> <script> <text/javascript " src = "./ extjs4.1/locale/ext-lang-zh_cn.js"> </script> <script type = "text/javaScript"> ext.onready (function () {// 사용자 정의 데이터 모델 var mymodel = ext.define ( "windentInfo", {extend : 'ext.data.model', fields : 'string'}, {이름 : 'stuname', type : 'string'}, {name : 'stuclass', type : 'string'}, {이름 : 'chscore', type : 'number'}, {name : 'mascore', 'number'}, {number ','number '},'number '}]. }); / / / 로컬 데이터 var mydata = [[ 'no1', 'wangzs1', '1 학년', 80, 67, 49], [ 'no2', 'wangzs2', 'grade 2', 65, 57, 79], [ 'no3', 'wangzs3', '3', 45, 77, 59], '', ',', ',', ',', ',', ',', ' 4 ', 99, 27, 19], ['no5 ','wangzs5 ','5 학년 ', 23, 97, 99], ['no6 ','wangzs6 ','grade 6 ', 34, 67, 99],]; var mystore = ext.create ( "ext.data.store", {model : 'studentinfo', data : mydata}); // table var mygrid = new ext.grid.panel ({열 : [{xtype : 'rownumberer', 'text :'line number '}, {text :'stunumber ', dataindex :'stuno '}, {text :'name ', dataindex :'stuname '},'text : 'class', 'staindex :'stuclass '} '중국어', dataindex : 'chscore'}, {text : 'mathematics', dataindex : 'mascore'}, {text : 'English', DatainDex : 'Enscore'}], Store : Mystore}); // Window var window = ext.create ( "ext.window.window", {제목 : '학생 등급 테이블', 너비 : 600, 높이 : 400, 항목 : MyGrid : 'fit'}); window.show (); }); </script> </head> <hod> 로컬 데이터 표시 <br> </body> </html>3. 크로스 도메인 JSONP 데이터를 표시합니다
<%@ page language = "java"import = "java.util.*"pageEncoding = "utf-8"%> <! doctype html public "-// w3c // dtd html 4.01 Transitional // en"> <html> <head> <title> my jsp 'index.jsp'시작 페이지 ""링크 rel " type = "text/css"href = "./ extjs4.1/resources/css/ext-all.css"> <script type = "text/javaScript"src = "./ extjs4.1/ext-all-debug.js"> </script> <script> <text/javascript " src = "./ extjs4.1/locale/ext-lang-zh_cn.js"> </script> <script type = "text/javaScript"> ext.onready (function () {// 사용자 정의 데이터 var jsonpmodel = ext.define ( "jsonpmodel", {extend. ', filds : [extend. : 'string'}, {name : 'username', type : 'string'}, {name : 'dateline', type : 'string'}, 'title', type : 'string'}}}); 프록시 : {type : 'jsonp', url : 'http://www.sencha.com/forum/topics-browse-remote.php', Reader : {TotalProperty : 'TotalCount', root : 'topics'}, autoload : true // // table var mygrid = new ext.grid.panel ({columns : [{xtype : 'rownumberer', 'text :'line number '}, {text :'userId ', dataindex :'userId '}, {text :'username ', dataindex :'username ', {timeline', dataindex : 'timeline', 'timeline :'timeline : 'timeline :'extaindex : 'extaindex :'extaindex : 'extaindex :'extaindex : 'extaindex :'extaindex : '{username'} 'title', dataindex : 'title'}], store : mystore, bbar : {// 테이블 하단의 페이징 구성 xtype : 'pagingtoolbar', store : mystore, displayInfo : true}}); // Window var window = ext.create ( "ext.window.window", {제목 : '학생 등급 테이블', 너비 : 600, 높이 : 400, 항목 : MyGrid : 'fit'}); window.show (); }); </script> </head> <hod> 크로스 도메인 JSONP 데이터 <br> </body> </html>