最近一直都在看EXTJS的东西,然后自己实践了下,界面倒是蛮漂亮的,但是一旦涉及到与服务器端进行数据互动麻烦就出来了,本来下了个例子确发现是用DWR的,觉得我既然用了STRUTS2作为MVC的框架,我觉得这个框架还是很不错的,觉得还是把EXTJS整合到一起更好些,找了相关的资料,跟着前辈做了下例子,发现完全不是那么回事,只好自己慢慢摸索,终于把数据交互的问题解决了,所以记录之以便查阅!
       还是从底层开始说吧,拿最经典的例子来解说吧,订单和客户的关系显然是n:1的关系,我hibernate不是用的声明方式所以就用的xml方式做的那么相应的hbm.xml文件如下:
       ORDER.XML

<?xml version="1.0"?>
<!DOCTYPE hibernate-mapping PUBLIC 
    "-//Hibernate/Hibernate Mapping DTD 3.0//EN"
    "http://hibernate.sourceforge.net/hibernate-mapping-3.0.dtd"> 
       <hibernate-mapping>
       <class name="com.model.Order"  table="t_order" lazy="false">
           <id name="orderId" column="OrderId">
               <generator class="uuid.hex" />
           </id>
           <property name="name" column="Name" type="string" />
           <property name="desn" column="Desn" type="string"/>
           <property name="booktime" column="Booktime" type="string"/>
           <property name="company" column="Company" />
           <many-to-one lazy="false" name="custom" column="CustomId" class="com.model.Customer" />
       </class>
   </hibernate-mapping>

CUSTOM.XML

<?xml version="1.0"?>
<!DOCTYPE hibernate-mapping PUBLIC 
    "-//Hibernate/Hibernate Mapping DTD 3.0//EN"
    "http://hibernate.sourceforge.net/hibernate-mapping-3.0.dtd"> 
   <hibernate-mapping>
       <class name="com.model.Custom"  table="t_custom" lazy="false">
           <id name="customId" column="Id">
               <generator class="uuid.hex" />
           </id>
           <property name="customName" column="Name" type="string" />
       </class>
   </hibernate-mapping>

相应的MODEL的JAVA我就不写了,只是做个例子而已,呵呵!相应的DAO SERVICE 我都不写了,这个不是我讨论的范围,那么我想在页面上显示所有的信息,那么在OrderAction中我定义了一个getAllOrder的方法,然后通过struts2配置action让EXTJS与服务器数据进行数据交互。因为EXTJS是支持JSON数据格式的,所以我用了JSON-LIB(json-lib-2.2.1-jdk15.jar)这个东东,它还依赖另外的3个包:commons-beanutils-1.7.1-20061106.jar,commons-collections-3.2.1.jar,ezmorph-1.0.4.jar。好了万事俱备只欠东风了,我的getAllOrder方法如下:

import java.text.DateFormat;
import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.List;
import net.sf.json.*;
//具体的那些serivce的包引入我就省略了
public class OrderAction extends ActionSupport
{
   private static final long serialVersionUID = -5092865658281004791L;
    private IOrderSerivce orderSerivce;
    private String jsonString;//这个就是中转站了
    private List<Order> orderList;//这个是数据链表
    private int totalCount;//这个是extjs用来分页
     public String getJsonString()
    {
        return jsonString;
    }
     public void setJsonString(String jsonString)
    {
        this.jsonString = jsonString;
    }
    public int getTotalCount()
    {
        return totalCount;
    }
    public void setTotalCount(int totalCount)
    {
        this.totalCount = totalCount;
    }
    public List<Air> getOrderList()
    {
        return orderList;
    }
    public void setOrderList(List<Order> orderList)
    {
        this.orderList = orderList;
    }
    public void setOrderSerivce(OrderSerivce orderSerivce)
    {
        this.orderSerivce = orderSerivce;
    }
    public String getAllAir()
    {
        orderList = orderSerivce.getOrderAll();
        this.setTotalCount(orderList.size());
        
        JSONArray array = JSONArray.fromObject(orderList);
//哈哈,就是在这里进行转换的
        this.jsonString = "{totalCount:"+this.getTotalCount()+",results:"+array.toString()+"}";
    return SUCCESS;
    }
}

接下来再是什么,哦,是的,应该是STRUTS的配置了,哈哈

<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
    "http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>
      <package name="order" extends="struts-default">
<action name="getAllOrder" class="orderAction" method="getAllOrder">
            <result name="success" >jsondata.jsp</result>
        </action>
      </package>
</struts>

好的,看到jsondata.jsp了么,这里就是要放数据的地方,看看是什么吧!

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<s:property value="jsonString" escape="false" />

是的,就是这么简单的一个代码!终于要到前台了,该露脸了,呵呵,前台代码最关键的也就是JS代码,那么我也就只贴JS了相信大家看过后都会自己弄清楚的!

/**//*
 * Ext JS Library 2.1
 * Copyright(c) 2006-2008, Ext JS, LLC.
 * licensing@extjs.com
 * 
 * http://extjs.com/license
 */


Ext.onReady(function(){
    Ext.BLANK_IMAGE_URL = 'ext/resources/images/default/s.gif'; 
    Ext.QuickTips.init();
    var xg = Ext.grid;
    //这里就是设置解析格式的地方,一定要和你的Model一样,要不然可是什么都得不到哦~~~~
    var rd = new Ext.data.JsonReader({
                //总记录数
                totalProperty: 'totalCount', 
                //哪儿是数据的头,可以看action里面是怎么定义数据格式的,这里就是如何解析的           
                    root: 'results', 
                //有那些字段呢?
                fields:[
                         {name:'orderId'},
                                      {name:'desn'},
                         {name:'booktime'},
                         {name:'company'},
                         {name:'name'},
                            //这里就是对custom对象进行映射的地方                        
                                      {name:'customId' ,mapping:'custom.customId'},
                         {name:'customName',mapping:'custom.customName'}
                         ]
                                     });
     var ds = new Ext.data.Store({
                                    proxy: new Ext.data.HttpProxy
({url: 'getAllOrder.action',method:'POST'}),//Url很关键,我就是因为没配好这个,POST方法很重要,你可以省略,让你看下错误也行的!耽误了一大堆时间!
                                    reader:rd
                                });
     ds.load();
     var sm =new xg.CheckboxSelectionModel(); //CheckBox选择列
     var cm =new xg.ColumnModel([
                                  new Ext.grid.RowNumberer(), //行号列 
                                  sm,
                                  {id:'orderId',header: "订单号", dataIndex: 'name'},                           {header: "订单时间",   dataIndex: 'booktime'},
                                  {header: "订单公司", dataIndex: 'company'},
                                  {header:"客户姓名",dataIndex:'customName'}
                                 ]);
                                 cm.defaultSortable = true;
    ////
    // OrderGrid 
    ////

    var ordergrid = new xg.GridPanel({
                                  ds: ds,
                                  sm: sm, 
                                  cm: cm, 
                                  width:1000,
                                  height:500,
                                  frame:true,
                                  title:'Framed with Checkbox Selection and Horizontal Scrolling',
                                  iconCls:'icon-grid',
                                  renderTo: document.body
                                 });
    ordergrid.render();

});



转载于:https://www.cnblogs.com/lxJack/archive/2011/06/03/2071947.html

ExtJs + Struts2 + JSON 程序总结相关推荐

  1. org.apache.struts2.json.JSONException: org.hibernate.LazyInitializationException: failed to lazily i

    数据转换成json数据失败,封装的实体类中有集合字段,在get方法上面加@JSON(serialize=false)注解 @JSON(serialize=false) public Set<Su ...

  2. java ajax报错500,(Struts2+JSON+Ajax) XMLHttpRequest ==500如何解决

    (Struts2+JSON+Ajax) XMLHttpRequest ==500怎么解决? 本帖最后由 zjlisok 于 2013-01-29 02:00:05 编辑 XMLHttpRequest. ...

  3. org.apache.struts2.json.JSONWriter can not access a member of class

    偶遇一个问题:org.apache.struts2.json.JSONWriter can not access a member of class  org.apache.tomcat.dbcp.d ...

  4. struts2+json(3)

    http://www.cnblogs.com/wuyifu/archive/2013/05/11/3073047.html 在Action中以Struts2的方式输出JSON数据 本着"不重 ...

  5. org.apache.struts2.json.JSONException: java.lang.reflect.InvocationTargetException异常解决

    org.apache.struts2.json.JSONException: java.lang.reflect.InvocationTargetException异常解决 参考文章: (1)org. ...

  6. Struts2+JSON特别让人恶心的一个问题

    在struts2中发现,调用action中的方法,方法会被执行两次,调了1整天,在百度上搜索关键字用的"json struts2".先一直以为是配置或者前台Ajax的问题.后来同学 ...

  7. 1.Android中解析json程序代码

    Android程序解析json数据可以通过gson的方式,这种情况需要导入相应的jar包.测试代码如下: @Override protected void onCreate(Bundle savedI ...

  8. 29. ExtJs - Struts2 整合(1) - 登录页面

    转自:https://yarafa.iteye.com/blog/729197 初学 ExtJS,在此记录下学习过程中的点点滴滴,以备不时只需,也希望能给跟我一样的菜鸟一些帮助,老鸟请忽略.如有不当之 ...

  9. kbmmw 与extjs 通过JSON Base64 显示图片

    delphi 官网上开始也来越多的介绍delphi与extjs 结合的例子,今天我就把官方的例子翻版一下. 官方使用C++builder 和webbroker 实现. 我使用kbmmw 来实现一下. ...

  10. Struts2 JSON

    JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式  (本质是一种数据传输格式) 定义json对象 var json={"firstName&quo ...

最新文章

  1. tensorflow 多输入 多输出 模型
  2. nyoj 47 江 河问题 【贪婪】
  3. maven各个属性参数详解
  4. 事件过滤器及不规则窗体
  5. python爬虫进阶(初始)
  6. python数据挖掘电影评分分析_Pyhon数据分析项目——男女电影评分差异比较
  7. linux运维(一)
  8. matlab rfdata,MATLAB在射频电路设计中的应用
  9. Python3截图识字工具
  10. 如何进行自动驾驶算法开发
  11. js中深克隆与浅克隆
  12. 蔡学镛:如何进入程序设计的领域- -
  13. 【Echarts】- 制作饼图
  14. 使用java爬取国家统计局的12位行政区划代码
  15. 技术宅教你如何煎一个特别牛逼且装逼的牛排
  16. python导入scipy库、sympy库遇到的问题及解决方式
  17. 漫画 |《程序员十二时辰》,居然是这样的!内容过于真实 ...
  18. 【VBScript】MsgBox()函数
  19. 老照片怎么修复清晰?轻松几步让图片焕发新生
  20. 【代码】C++实现二叉树基本操作及测试用例

热门文章

  1. 接口(Interface)的作用
  2. vs2005 虚拟调试配置(转)
  3. 20号:JAVA的值传递与引用传递的正确理解
  4. ip_conntrack: falling back to vmalloc解决办法
  5. PHP 判断字符的编码 并输出想要的编码格式字符 (转)
  6. 不用js实现鼠标放上去改变文字内容
  7. Arduino 各种模块篇 舵机 Modules - Servo
  8. C语身教程第十章:文件(8)
  9. ORACLE 字符串操作
  10. 设计模式 创建型 工厂方法模式