您的位置:首页 > 数据库

GWT - GWT Designer开发Ajax应用 (05) 利用RPC传递对象

2011-08-03 16:21 531 查看
http://blog.csdn.net/pathuang68/article/details/4263162

概要说明:

输入一个ID,从服务器端传递与此ID对应的Contact对象。

1. 新建一个GWT Java Project



图1

设置项目名称为“ContactInfo”,点击Next按钮,



图2

选中Create GWT module,并设定module的名称为“ContactInfo”,Package名称为“com.pnft.ajax”,点击Finish按钮。创建项目的详细过程见GWTDesigner04。

2. 创建一个POJO类:Contact



图3

注意,一定要在com.pnft.ajax.client包中创建。编辑Contact.java代码,使之如下:

package com.pnft.ajax.client;
import com.google.gwt.user.client.rpc.IsSerializable;
 
public class Contact implements IsSerializable
{
    private int id;
    private String name;
    private String sex;
    private int age;
    private String email;
    private String address;
    private String phone;
   
    public Contact()
    {  
    }
   
    public int getId() {
        return id;
    }
    public void setId(int id) {
        this.id = id;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
    public String getSex() {
        return sex;
    }
    public void setSex(String sex) {
        this.sex = sex;
    }
    public int getAge() {
        return age;
    }
    public void setAge(int age) {
        this.age = age;
    }
    public String getEmail() {
        return email;
    }
    public void setEmail(String email) {
        this.email = email;
    }
    public String getAddress() {
        return address;
    }
    public void setAddress(String address) {
        this.address = address;
    }
    public String getPhone() {
        return phone;
    }
    public void setPhone(String phone) {
        this.phone = phone;
    }
}
注意:一定要使其实现IsSerializable接口,否则Contact对象不能正确传递。

3. 创建一个GWT Remote Service,并将其取名为ContactInfoService。



图4
创建Remote Service的详细步骤,请见GWTDesigner04。
 
在ContactInfoService中增加一个方法:public Contact getContact(int id);
使得整个ContactInfoService.java代码如下:
 
public interface ContactInfoService extends RemoteService
{
    public Contact getContact(int id);
    /**
     * Utility class for simplifying access to the instance of async service.
     */
    public static class Util {
        private static ContactInfoServiceAsync instance;
        public static ContactInfoServiceAsync getInstance(){
            if (instance == null) {
                instance = (ContactInfoServiceAsync) GWT.create(ContactInfoService.class);
                ServiceDefTarget target = (ServiceDefTarget) instance;
                target.setServiceEntryPoint(GWT.getModuleBaseURL() + "ContactInfoService");
            }
            return instance;
        }
    }
}
保存。这会导致在ContactInfoServiceAsync.java和ContactInfoServiceImpl.java中增加和这个接口方法相关的的一些代码。

4. 在GWT Designer中的Design模式下修改ContactInfo.java文件,使其界面如下:



图5
注意:修改了Button,TextBox和Label的相关的css。

5. 在步骤4的基础上修改代码,增加OK按钮的消息处理方法,是整个ContactInfo.java代码如下:
public class ContactInfo implements EntryPoint
{
    // 创建Widget
    private TextBox textBoxID = new TextBox();
    private[/b] Button buttonOK = new Button();
    private Label labelName = new Label("Name:");
    private Label labelSex = new Label("Sex:");
    private Label labelAge = new Label("Age:");
    private Label labelEmail = new Label("Email:");
    private Label labelAddress = new Label("Address:");
    private Label labelPhone = new Label("Phone:");
    private TextBox textBoxName = new TextBox();
    private TextBox textBoxSex = new TextBox();
    private TextBox textBoxAge = new TextBox();
    private TextBox textBoxEmail = new TextBox();
    private TextBox textBoxAddress = new TextBox();
    private TextBox textBoxPhone = new TextBox();
    private Label labelWarning = new Label("");
   
    // 使相关Widget可见或者不可见
    private void setVisible(boolean isVisible)
    {
        labelName.setVisible(isVisible);
        labelSex.setVisible(isVisible);
        labelAge.setVisible(isVisible);
        labelEmail.setVisible(isVisible);
        labelAddress.setVisible(isVisible);
        labelPhone.setVisible(isVisible);
        textBoxName.setVisible(isVisible);
        textBoxSex.setVisible(isVisible);
        textBoxAge.setVisible(isVisible);
        textBoxEmail.setVisible(isVisible);
        textBoxAddress.setVisible(isVisible);
        textBoxPhone.setVisible(isVisible);
        labelWarning.setVisible(!isVisible);
    }
 
    public void onModuleLoad()
    {
        final RootPanel rootPanel = RootPanel.get();
       
        // Widget在rootPanel中的布局,由GWT Designer自动生成
        textBoxID = new TextBox();
        rootPanel.add(textBoxID, 42, 41);
 
        buttonOK = new Button();
        rootPanel.add(buttonOK, 182, 37);
        buttonOK.setSize("46px", "27px");
 
        buttonOK.setText("OK");
 
        labelName = new Label("Name:");
        rootPanel.add(labelName, 70, 105);
 
        labelSex = new Label("Sex:");
        rootPanel.add(labelSex, 80, 130);
 
        labelAge = new Label("Age:");
        rootPanel.add(labelAge, 80, 155);
 
        labelEmail = new Label("Email:");
        rootPanel.add(labelEmail, 70, 180);
 
        labelAddress = new Label("Address:");
        rootPanel.add(labelAddress, 55, 205);
 
        labelPhone = new Label("Phone:");
        rootPanel.add(labelPhone, 65, 230);
 
        textBoxName = new TextBox();
        rootPanel.add(textBoxName, 135, 100);
        textBoxName.setEnabled(false);
 
        textBoxSex = new TextBox();
        rootPanel.add(textBoxSex, 135, 125);
        textBoxSex.setEnabled(false);
        textBoxSex.setWidth("63px");
 
        textBoxAge = new TextBox();
        rootPanel.add(textBoxAge, 135, 150);
        textBoxAge.setEnabled(false);
        textBoxAge.setWidth("63px");
 
        textBoxEmail = new TextBox();
        rootPanel.add(textBoxEmail, 135, 175);
        textBoxEmail.setEnabled(false);
        textBoxEmail.setVisibleLength(30);
        textBoxEmail.setWidth("263px");
 
        textBoxAddress = new TextBox();
        rootPanel.add(textBoxAddress, 135, 200);
        textBoxAddress.setEnabled(false);
        textBoxAddress.setVisibleLength(30);
        textBoxAddress.setWidth("263px");
 
        textBoxPhone = new TextBox();
        rootPanel.add(textBoxPhone, 135, 225);
        textBoxPhone.setEnabled(false);
        textBoxPhone.setSize("124px", "21px");
 
        labelWarning = new Label("");
        rootPanel.add(labelWarning, 40, 78);
        labelWarning.setWidth("221px");
       
        // 开始时使相关Widget不可见
        setVisible(false);
       
        // 消息响应方法
        buttonOK.addClickListener(new ClickListener()
        {
            public void onClick(final Widget sender)
            {
                ContactInfoServiceAsync cisa = (ContactInfoServiceAsync)
GWT.create(ContactInfoService.class);
                ((ServiceDefTarget)cisa).setServiceEntryPoint(GWT.getModuleBaseURL() +
"ContactInfoService");
 
                // 如果textBoxID为空,则将其值设为0,否则转换成对应的数字
                Integer aInt = new Integer(0);
                if (textBoxID.getText() != "")
                {  
                    aInt = new Integer(Integer.parseInt(textBoxID.getText()));
                }
               
                cisa.getContact(aInt.intValue(), new AsyncCallback()
                {
                    public void onFailure(Throwable caught)
                    {
                        // 失败
                        Window.alert("Failed to get response form server:/n" +
caught.getMessage());
                    }
                   
                    public void onSuccess(Object result)
                    {
                        // 成功。有Contact对象返回
                        Contact contact = (Contact)result;
                       
                        if(contact != null)
                        {
                            // 如果contact不为空,则显示相关Wdiget,并根据返回结果,设置相应的值
                            setVisible(true);
                            textBoxName.setText(contact.getName());
                            textBoxSex.setText(contact.getSex());
                            textBoxAge.setText((new Integer(contact.getAge())).toString());
                            textBoxEmail.setText(contact.getEmail());
                            textBoxAddress.setText(contact.getAddress());
                            textBoxPhone.setText(contact.getPhone());
                        }
                        else
                        {
                            // 如果contact为空,则不隐藏相关的Widget,并在labelWarning上显示
                            // "No person with such an ID!"
                            setVisible(false);
                            labelWarning.setText("No person with such an ID!");
                            textBoxName.setText("");
                            textBoxSex.setText("");
                            textBoxAge.setText("");
                            textBoxEmail.setText("");
                            textBoxAddress.setText("");
                            textBoxPhone.setText("");
                        }
                    }
                });
            }
        });
    }
}

6. 在服务器端实现在ContactInfoServiceImpl.java中定义的getContact方法如下:
    @Override
    public Contact getContact(int id)
    {
        Contact contact = new Contact();
        if(id == 100)
        {
            // 假设一下数据是从数据库或其他数据源中得到
            contact.setId(100);
            contact.setName("玄机逸士");
            contact.setSex("男");
            contact.setAge(30);
            contact.setEmail("pathuang68@gmail.com");
            contact.setPhone("18968919681");
            contact.setAddress("中国北京东城区xx街道xx号xx楼xx房间");
           
            return contact;
        }
        return null;
    }
 
到此,所有代码的开发工作已经完成。

7. 在hosted mode运行。



图6
结果如下:



图7
输入100,并点击OK按钮,得到



图8
 
输入101,点击OK按钮将得到,



图9
 
结果正确。

8. 部署。



图10
部署到D:/Tomcat6/webapps目录下:



图11
点击OK按钮即可。

9. web mode下的运行结果(启动Tomcat,如果没有启动的话):
- IE6中的结果:



图12
输入100,点击OK按钮,



图13
 
输入101,点击OK按钮,



图14
 结果正确。
 
- 在FireFox3中的运行结果:



图15
输入100,点击OK按钮,



图16
 
输入101,点击OK按钮,



图17
 运行结果也正确。但表现形式和IE6有所不同,同时GWT Designer自动产生的css的作用似乎也没有表现出来。

10. 建立数据库表,并插入测试数据。



图18
利用MySQL Administrator,在数据库andrew中新建一个数据表,各字段信息如上图,它们和Contact.java中的属性一一对应。
 
新建一个sql文件testdata.sql,其内容如下:
insert into contact(name, sex, age, email, phone, address) values('玄机逸士01', '男', 30, 'pathuang30@163.com', '13823098201', '中国北京市东城区x街道x大厦x层x房间');
insert into contact(name, sex, age, email, phone, address) values('玄机逸士02', '男', 31, 'pathuang31@163.com', '13823098202', '中国北京市东城区x街道x大厦x层x房间');
……
insert into contact(name, sex, age, email, phone, address) values('玄机逸士60', '男', 89, 'pathuang69@163.com', '13823098260', '中国北京市东城区x街道x大厦x层x房间');
 
共60条记录,也就是说他们的ID是从1到60。
 
用如下方式导入testdata.sql中的数据:



图19

11. 修改ContactInfoServiceImpl.java,使其从真正意义上链接数据库。代码如下:
public class ContactInfoServiceImpl extends RemoteServiceServlet
                                           implements ContactInfoService
{  
    private static Statement mysqlStmt;
   
    private Statement getStatement()
    {
        Connection conn = null;
        Statement stmt = null;
        try
        {
            // localhost:3306   mysql服务器地址:mysql服务端口
            // andrew           数据库名称
            // user=patrick     用户名为patrick
            // password=hi      密码为hi
            Class.forName("com.mysql.jdbc.Driver");
            conn = DriverManager.getConnection(
"jdbc:mysql://localhost:3306/andrew?user=patrick&password=hi");
            stmt = conn.createStatement();
        }
        catch(Exception e)
        {
            e.printStackTrace();
        }
        return stmt;
    }
   
    // 重载servlet的init方法,在这里获取mysqlStmt
    @Override
    public void init() throws ServletException
    {
        mysqlStmt = getStatement();
        super.init();
    }  
   
    private ResultSet selectByID(int id)
    {
        ResultSet rs = null;
        try
        {
            rs = mysqlStmt.executeQuery("select * from Contact where id = '" + id + "'" );
        }
        catch(Exception ex)
        {
            ex.printStackTrace();
        }
        return rs;
    }
   
    @Override
    public Contact getContact(int id)
    {
        Contact contact = new Contact();
        ResultSet rs = selectByID(id);
        try
        {
            if(rs.next())
            {
                contact.setName(rs.getString("name"));
                contact.setSex(rs.getString("sex"));
                contact.setAge(((Integer)rs.getInt("age")).intValue());
                contact.setEmail(rs.getString("email"));
                contact.setPhone(rs.getString("phone"));
                contact.setAddress(rs.getString("address"));
                return contact;
            }
        }
        catch(Exception e)
        {
            e.printStackTrace();
        }
        return null;
    }
}
 
保存,并重新发布。结果如下:



图20
输入100,点击OK按钮,得到,



图21
根据前面数据库表的测试数据知道ID的范围是1~60,因此不存在ID为100的情况。
 
输入为1的情况:



图22
 
输入为30的情况:



图23
 
输入为60的情况:



图24
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息