Tuesday, July 06, 2010

ExtGWTShowCaseExample

ExtGWTShowCaseExample : This example use the Show Case Pagination Grid of EXT-GWT and fetch the data from My-SQL.

ExtGWTShowCaseExample.gwt.xml:

xml version="1.0" encoding="UTF-8"?>

<module rename-to='extgwtshowcaseexample'>

<inherits name='com.google.gwt.user.User'/>

<inherits name='com.google.gwt.user.theme.standard.Standard'/>

<inherits name='com.extjs.gxt.ui.GXT' />

<entry-point class='extGWTShowCaseExample.client.ExtGWTShowCaseExample'/>

<source path='client'/>

<source path='shared'/>

module>

BeanPost:

package extGWTShowCaseExample.client;

import java.io.Serializable;

import com.extjs.gxt.ui.client.data.BeanModelTag;

public class BeanPost implements BeanModelTag, Serializable {

String id;

String name;

public String getId() {

return id;

}

public void setId(String id) {

this.id = id;

}

public String getName() {

return name;

}

public void setName(String name) {

this.name = name;

}

}

ExtGWTShowCaseExample:

package extGWTShowCaseExample.client;

import java.util.ArrayList;

import java.util.List;

import java.util.Map;

import com.extjs.gxt.ui.client.Style.SortDir;

import com.extjs.gxt.ui.client.data.BasePagingLoadConfig;

import com.extjs.gxt.ui.client.data.BasePagingLoader;

import com.extjs.gxt.ui.client.data.ModelData;

import com.extjs.gxt.ui.client.data.PagingLoadConfig;

import com.extjs.gxt.ui.client.data.PagingLoadResult;

import com.extjs.gxt.ui.client.data.PagingLoader;

import com.extjs.gxt.ui.client.data.RpcProxy;

import com.extjs.gxt.ui.client.event.Events;

import com.extjs.gxt.ui.client.event.GridEvent;

import com.extjs.gxt.ui.client.event.Listener;

import com.extjs.gxt.ui.client.store.ListStore;

import com.extjs.gxt.ui.client.widget.ContentPanel;

import com.extjs.gxt.ui.client.widget.Layout;

import com.extjs.gxt.ui.client.widget.LayoutContainer;

import com.extjs.gxt.ui.client.widget.grid.ColumnConfig;

import com.extjs.gxt.ui.client.widget.grid.ColumnModel;

import com.extjs.gxt.ui.client.widget.grid.Grid;

import com.extjs.gxt.ui.client.widget.layout.AnchorLayout;

import com.extjs.gxt.ui.client.widget.layout.FitLayout;

import com.extjs.gxt.ui.client.widget.layout.FlowLayout;

import com.extjs.gxt.ui.client.widget.toolbar.PagingToolBar;

import com.google.gwt.core.client.EntryPoint;

import com.google.gwt.core.client.GWT;

import com.google.gwt.user.client.Element;

import com.google.gwt.user.client.rpc.AsyncCallback;

import com.google.gwt.user.client.rpc.ServiceDefTarget;

import com.google.gwt.user.client.ui.RootPanel;

/**

* Entry point classes define onModuleLoad().

*/

public class ExtGWTShowCaseExample implements EntryPoint {

private static final String SERVER_ERROR = "An error occurred while "

+ "attempting to contact the server. Please check your network "

+ "connection and try again.";

//private final GreetingServiceAsync greetingService = GWT.create(GreetingService.class);

private static extGWTShowCaseExample.client.GreetingServiceAsync ourInstance = getInstance();

public static synchronized extGWTShowCaseExample.client.GreetingServiceAsync getInstance() {

if (ourInstance == null) {

ourInstance = (extGWTShowCaseExample.client.GreetingServiceAsync) GWT.create(GreetingService.class);

((ServiceDefTarget) ourInstance).setServiceEntryPoint(GWT.getModuleBaseURL() + "GreetingService");

}

return ourInstance;

}

public void onModuleLoad() {

//to add something TBD

@SuppressWarnings("unused")

Layout junk = new AnchorLayout();

TemplatePaginationExample objTemplatePaginationExample = new TemplatePaginationExample();

RootPanel.get().add(objTemplatePaginationExample);

}

//private VerticalPanel vp;

//private FormData formData;

//by siddhu[

//For Portal Start[

/*

class TemplatePortalExample extends LayoutContainer {

@Override

protected void onRender(Element parent, int index) {

super.onRender(parent, index);

setLayout(new BorderLayout());

BorderLayoutData westData = new BorderLayoutData(LayoutRegion.WEST, 200, 100, 300);

westData.setMargins(new Margins(5, 0, 5, 5));

westData.setCollapsible(true);

Portal portal = new Portal(3);

portal.setBorders(true);

portal.setStyleAttribute("backgroundColor", "white");

portal.setColumnWidth(0, .33);

portal.setColumnWidth(1, .33);

portal.setColumnWidth(2, .33);

Portlet portlet = new Portlet();

portlet.setHeading("Another Panel 1");

//by siddhu[

formData = new FormData("-20");

vp = new VerticalPanel();

vp.setSpacing(10);

//createForm1();

FormPanel simple = new FormPanel();

simple.setHeading("Ext GWT Portel Form");

simple.setFrame(true);

//simple.setWidth(450);

simple.setWidth(portlet.getWidth());

final TextField firstNumber = new TextField();

firstNumber.setFieldLabel("First Number");

//firstName.setAllowBlank(false);

simple.add(firstNumber, formData);

final TextField secondNumber = new TextField();

secondNumber.setFieldLabel("Second Number");

//name.setAllowBlank(false);

simple.add(secondNumber, formData);

final TextField answer = new TextField();

answer.setFieldLabel("Answer");

//name.setAllowBlank(false);

simple.add(answer, formData);

SelectionListener l = new SelectionListener() {

@Override

public void componentSelected(ButtonEvent ce) {

//Info.display("Click", ce.getButton().getText() + " clicked");

if(ce.getButton().getText()!= null && (!ce.getButton().getText().equals("")&&ce.getButton().getText().equals("Add")))

{

Integer intFirstNumber = Integer.parseInt(firstNumber.getValue());

Integer intSecondNumber = Integer.parseInt(secondNumber.getValue());

Integer intAnswer = intFirstNumber + intSecondNumber;

answer.setValue(intAnswer.toString());

}

}

};

Button insert = new Button("Add",l);

simple.addButton(insert);

portlet.add(simple);

//by siddhu]

configPanel(portlet);

//portlet.addText(getBogusText());

portal.add(portlet, 0);

BorderLayoutData centerData = new BorderLayoutData(LayoutRegion.CENTER);

centerData.setMargins(new Margins(5));

add(portal, centerData);

}

}

private void configPanel(final ContentPanel panel) {

panel.setCollapsible(true);

panel.setAnimCollapse(false);

panel.getHeader().addTool(new ToolButton("x-tool-gear"));

panel.getHeader().addTool(

new ToolButton("x-tool-close", new SelectionListener() {

@Override

public void componentSelected(IconButtonEvent ce) {

panel.removeFromParent();

}

}));

}

*/

//For Portal End]

//For Pagination Start[

class TemplatePaginationExample extends LayoutContainer {

@Override

protected void onRender(Element parent, int index) {

super.onRender(parent, index);

//final GreetingServiceAsync service = (GreetingServiceAsync) Registry.get(Examples.SERVICE);

//final GreetingServiceAsync service = greetingService.getPosts(new AsyncCallback() {});

FlowLayout layout = new FlowLayout(10);

setLayout(layout);

RpcProxy> proxy = new RpcProxy>() {

@Override

public void load(Object loadConfig, AsyncCallback> callback) {

ourInstance.getPosts((PagingLoadConfig) loadConfig, callback);

}

};

System.out.println("Valueo of proxy is:"+proxy);

// loader

final PagingLoader> loader = new BasePagingLoader>(proxy);

loader.setRemoteSort(true);

ListStore store = new ListStore(loader);

final PagingToolBar toolBar = new PagingToolBar(5);

toolBar.bind(loader);

List columns = new ArrayList();

columns.add(new ColumnConfig("id", "ID", 10));

columns.add(new ColumnConfig("name", "Name", 50));

ColumnModel cm = new ColumnModel(columns);

final Grid grid = new Grid(store, cm);

grid.setStateId("pagingGridExample");

grid.setStateful(true);

grid.addListener(Events.Attach, new Listener>() {

public void handleEvent(GridEvent be) {

PagingLoadConfig config = new BasePagingLoadConfig();

config.setOffset(0);

config.setLimit(50);

Map state = grid.getState();

if (state.containsKey("offset")) {

int offset = (Integer)state.get("offset");

int limit = (Integer)state.get("limit");

config.setOffset(offset);

config.setLimit(limit);

}

if (state.containsKey("sortField")) {

config.setSortField((String)state.get("sortField"));

config.setSortDir(SortDir.valueOf((String)state.get("sortDir")));

}

loader.load(config);

}

});

grid.setLoadMask(true);

grid.setBorders(true);

//grid.setAutoExpandColumn("id");

ContentPanel panel = new ContentPanel();

panel.setFrame(true);

panel.setCollapsible(true);

panel.setAnimCollapse(false);

//panel.setIcon(Resources.ICONS.table());

panel.setHeading("Paging Grid");

panel.setLayout(new FitLayout());

panel.add(grid);

panel.setSize(600, 350);

panel.setBottomComponent(toolBar);

add(panel);

}

}

//For Pagination End]

//by siddhu]

}

GreetingService:

package extGWTShowCaseExample.client;

import com.google.gwt.user.client.rpc.RemoteService;

import com.google.gwt.user.client.rpc.RemoteServiceRelativePath;

import com.extjs.gxt.ui.client.data.ModelData;

import com.extjs.gxt.ui.client.data.PagingLoadConfig;

import com.extjs.gxt.ui.client.data.PagingLoadResult;

/**

* The client side stub for the RPC service.

*/

public interface GreetingService extends RemoteService {

//String greetServer(String name) throws IllegalArgumentException;

public PagingLoadResult getPosts(PagingLoadConfig config);

}

GreetingServiceAsync:

package extGWTShowCaseExample.client;

import com.extjs.gxt.ui.client.data.PagingLoadConfig;

import com.extjs.gxt.ui.client.data.PagingLoadResult;

import com.google.gwt.user.client.rpc.AsyncCallback;

/**

* The async counterpart of GreetingService.

*/

public interface GreetingServiceAsync {

//void greetServer(String input, AsyncCallback callback) throws IllegalArgumentException;

public void getPosts(PagingLoadConfig config, AsyncCallback> callback);

}

Post:

package extGWTShowCaseExample.client;

import java.io.Serializable;

import com.extjs.gxt.ui.client.data.BaseTreeModel;

public class Post extends BaseTreeModel implements Serializable {

String id;

String name;

public Post() {

}

public String getId() {

return (String) get("id");

}

public void setId(String id) {

set("id", id);

}

public String getName() {

return (String) get("name");

}

public void setName(String name) {

set("name", name);

}

}

GreetingServiceImpl:

package extGWTShowCaseExample.server;

import java.sql.Connection;

import java.sql.DriverManager;

import java.sql.ResultSet;

import java.sql.Statement;

import java.util.ArrayList;

import java.util.Collections;

import java.util.Comparator;

import java.util.List;

import org.w3c.dom.NodeList;

import com.extjs.gxt.ui.client.data.BasePagingLoadResult;

import com.extjs.gxt.ui.client.data.PagingLoadConfig;

import com.extjs.gxt.ui.client.data.PagingLoadResult;

import com.google.gwt.user.server.rpc.RemoteServiceServlet;

import extGWTShowCaseExample.client.BeanPost;

import extGWTShowCaseExample.client.GreetingService;

import extGWTShowCaseExample.client.Post;

/**

* The server side implementation of the RPC service.

*/

@SuppressWarnings("serial")

public class GreetingServiceImpl extends RemoteServiceServlet implements

GreetingService {

String dbUrl = "jdbc:mysql://localhost/siddhutest_db";

String dbClass = "com.mysql.jdbc.Driver";

/*

public String greetServer(String input) throws IllegalArgumentException {

// Verify that the input is valid.

if (!FieldVerifier.isValidName(input)) {

// If the input is not valid, throw an IllegalArgumentException back to

// the client.

throw new IllegalArgumentException(

"Name must be at least 4 characters long");

}

String serverInfo = getServletContext().getServerInfo();

String userAgent = getThreadLocalRequest().getHeader("User-Agent");

return "Hello, " + input + "!

I am running " + serverInfo

+ ".

It looks like you are using:
" + userAgent;

}

*/

private List posts;

private List beanPosts;

public PagingLoadResult getPosts(final PagingLoadConfig config) {

if (posts == null) {

loadPosts();

System.out.println("Post is null");

}

if (config.getSortInfo().getSortField() != null) {

final String sortField = config.getSortInfo().getSortField();

if (sortField != null) {

Collections.sort(posts, config.getSortInfo().getSortDir().comparator(new Comparator() {

public int compare(Post p1, Post p2) {

if (sortField.equals("id")) {

return p1.getId().compareTo(p2.getId());

} else if (sortField.equals("name")) {

return p1.getName().compareTo(p2.getName());

}

return 0;

}

}));

}

}

ArrayList sublist = new ArrayList();

int start = config.getOffset();

int limit = posts.size();

if (config.getLimit() > 0) {

limit = Math.min(start + config.getLimit(), limit);

}

for (int i = config.getOffset(); i <>

sublist.add(posts.get(i));

}

return new BasePagingLoadResult(sublist, config.getOffset(), posts.size());

}

/*

private String getValue(NodeList fields, int index) {

NodeList list = fields.item(index).getChildNodes();

if (list.getLength() > 0) {

return list.item(0).getNodeValue();

} else {

return "";

}

}

*/

private void loadPosts() {

posts = new ArrayList();

beanPosts = new ArrayList();

try {

/*

NodeList nodeList = doc.getElementsByTagName("row");

for (int s = 0; s <>

Node fstNode = nodeList.item(s);

if (fstNode.getNodeType() == Node.ELEMENT_NODE) {

Element fstElmnt = (Element) fstNode;

NodeList fields = fstElmnt.getElementsByTagName("field");

Post p = new Post();

p.setForum(getValue(fields, 0));

p.setDate(sf.parse(getValue(fields, 1)));

p.setSubject(getValue(fields, 2));

p.setUsername(getValue(fields, 4));

posts.add(p);

BeanPost beanPost = new BeanPost();

beanPost.setForum(getValue(fields, 0));

beanPost.setDate(sf.parse(getValue(fields, 1)));

beanPost.setSubject(getValue(fields, 2));

beanPost.setUsername(getValue(fields, 4));

beanPosts.add(beanPost);

}

}*/

Class.forName(dbClass).newInstance();

Connection con = DriverManager.getConnection(dbUrl,"root","");

Statement stmt = con.createStatement();

String query = "SELECT * FROM test_table";

ResultSet rs = stmt.executeQuery(query);

while(rs.next())

{

Post p = new Post();

p.setId(rs.getString(1));

p.setName(rs.getString(2));

posts.add(p);

BeanPost beanPost = new BeanPost();

beanPost.setId(rs.getString(1));

beanPost.setName(rs.getString(2));

beanPosts.add(beanPost);

}

con.close();

//return "success";

} catch (Exception e) {

e.printStackTrace();

}

}

}

Web.xml:

xml version="1.0" encoding="UTF-8"?>

DOCTYPE web-app

PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"

"http://java.sun.com/dtd/web-app_2_3.dtd">

<web-app>

<servlet>

<servlet-name>greetServletservlet-name>

<servlet-class>extGWTShowCaseExample.server.GreetingServiceImplservlet-class>

servlet>

<servlet-mapping>

<servlet-name>greetServletservlet-name>

<url-pattern>/extgwtshowcaseexample/greeturl-pattern>

servlet-mapping>

<welcome-file-list>

<welcome-file>ExtGWTShowCaseExample.htmlwelcome-file>

welcome-file-list>

<servlet-mapping>

<servlet-name>greetServletservlet-name>

<url-pattern>/extgwtshowcaseexample/GreetingServiceurl-pattern>

servlet-mapping>

web-app>

ExtGWTShowCaseExample.html:

doctype html>

<html>

<head>

<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<link rel="stylesheet" type="text/css" href="resources/css/gxt-all.css" />

<title>Web Application Starter Projecttitle>

<script type="text/javascript" language="javascript" src="extgwtshowcaseexample/extgwtshowcaseexample.nocache.js">script>

head>

<body>

<iframe src="javascript:''" id="__gwt_historyFrame" tabIndex='-1' style="position:absolute;width:0;height:0;border:0">iframe>

<noscript>

<div style="width: 22em; position: absolute; left: 50%; margin-left: -11em; color: red; background-color: white; border: 1px solid red; padding: 4px; font-family: sans-serif">

Your web browser must have JavaScript enabled

in order for this application to display correctly.

div>

noscript>

<h1>Web Application Starter Projecth1>

body>

html>

No comments: