This post shows you how to build a very simple ajax dictionary. The dictionary does not have a database, it just add a string to keywords and send back to browsers. This application is a normal web application. In the third part, we will make a Ajax dictionary portlet in Liferay.
Step 1: Create a Web Project named AjaxDict
Step 2: Copy DWR.jar to
Step 3: Declare DWR Servlet in
<?xml version="1.0"?>
<!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>dwr-invoker</servlet-name>
<display-name>DWR Servlet</display-name>
<servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>dwr-invoker</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
</web-app>
Step 4.1: Create Dictionary Engine Class
package com.aq.jdict;
/**
* This is just a simple engine.
* In real application, this engine will search the keyword
* in database, then return the meaning and other information.
* @author naqalone
*
*/
public class JDEngine {
public static String search(String keyword)
{
String meaning="meaning of "+keyword;
return meaning;
}
}
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>A Sample Dictionary</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="Ajax Dictionary">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type='text/javascript'
src='/AjaxDict/dwr/interface/JDEngine.js'></script>
<script type='text/javascript' src='/AjaxDict/dwr/engine.js'></script>
<script type='text/javascript' src='/AjaxDict/dwr/util.js'></script>
<script>
function search()
{
var keyword;
keyword = DWRUtil.getValue("txtKeyword");
JDEngine.search(updateMeaning,keyword);
}
function updateMeaning(rxData)
{
DWRUtil.setValue("result",rxData);
}
</script>
</head>
<body>
<font color="#004080"> <strong>A very simple Ajax
Dictionary - Powered by DWR</strong> </font>
<br>
<br>
Keyword :
<input type="text" name="txtKeyword">
<input type="button" value="Search" name="btSearch"
onClick="javascript:search();">
<br>
Meaning:
<div id="result" border="1">
</div>
</body>
</html>
Step 5: Declare Engine class in
<!DOCTYPE dwr PUBLIC
"-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN"
"http://www.getahead.ltd.uk/dwr/dwr10.dtd">
<dwr>
<allow>
<create creator="none" javascript="JDEngine">
<param name="class" value="com.aq.jdict.JDEngine"/>
</create>
<convert converter="bean" match="com.aq.jdict.JDEntry"/>
</allow>
</dwr>
Step 6: Configure the JBoss (or Tomcat)server
If you already configured a server, you can skip this step.
Step 7: Deploy
Step 8: Start jBoss
Step 9: Test in IE or Firefox
GOTO: http://locaclhost:8080/AjaxDict
That's all!
Part 1,
2
December 21, 2006
How to use DWR in Liferay Portal (Part 2 - A simple Dictionary)
December 07, 2006
How to use DWR in Liferay Portal (Part 1 - Installation)
This tutorial shows you how to use DWR in Liferay.
I assume that you already know how to use DWR. If not, please go here: Getting started with DWR
1. Download file dwr.jar (Current stable version is 1.1.3 Updated 7/12/2006)
2. Copy dwr.jar to C:\training\Liferay\ext\ext-lib\portalJARs in the portal directory are automatically copied to the portal classpath and are only visible by the portal.
3. Create a test bean:
package com.test;
public class SampleBean {
private String myName;
private String[] myMovies;
public String[] getMyMovies() {
myMovies = new String[3];
myMovies[0] = "Happy Feet";
myMovies[1] = "Casino Royale";
myMovies[2] = "Lord of the Ring";
return myMovies;
}
public String getMyName() {
myName = "Anh Quan";
return myName;
}
}
4. Store the dwr.xml in C:\training\Liferay\ext\ext-web\docroot\WEB-INF
Here is a sample dwr.xml
<dwr>
<allow>
<create creator="new" javascript="SampleBean">
<param name="class" value="com.test.SampleBean"/>
</create>
</allow>
</dwr>
5. Deploy to tomcat: Start\Run\Cmd , then C:\trainging\liferay\ext\ant deploy
6. Start your tomcat server C:\trainging\liferay\tomcat\bin\startup.bat
Check point:
1. Be sure that dwr.jar is copied to C:\training\liferay\tomcat\webapps\ROOT\WEB-INF\lib
and dwr.xml is copied to C:\training\liferay\tomcat\webapps\ROOT\WEB-INF
7. In IE, go to http://localhost:8080/dwr
You will see something like :Classes known to DWR:
Go to http://localhost:8080/dwr/test/SampleBean, click "Execute" next to getMyMovies( );
You will see:
8. Congratulation! You are now ready to explore the power of DWR.
Part 1,2
December 02, 2006
Portlet development with XDoclet, ANT
Type your summary here.
Type the rest of your post here.
Struts based porlet in Liferay Portal
Type your summary here.
Type the rest of your post here.