聽聽 <servlet>
聽聽聽 <servlet-name>dwr-invoker</servlet-name>
聽聽聽 <display-name>DWR Servlet</display-name>
聽聽聽 <description>Direct Web Remoter Servlet</description>
聽聽聽 <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>
聽<welcome-file-list>
聽聽聽 <welcome-file>search.jsp</welcome-file>
聽</welcome-file-list>
2.dwr.xml
聽<dwr>
聽聽聽 <allow><convert convert="bean"聽 match="dwr.sample.Apartment"/>
聽聽聽 <create>
聽聽聽聽聽聽聽聽聽聽 <creator="new" javascript="ApartmentDAO" class="dwr.sample.ApartmentDAO">
聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽 <include method="findApartments"/>
聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽聽 <include method="countApartments"/>
聽聽聽聽聽聽聽聽聽聽 </creator>
聽聽聽 </create>
聽聽聽 </allow>
</dwr>
3.DB
CREATE TABLE APARTMENTS (id INTEGER, bedrooms INTEGER, bathrooms INTEGER, price INTEGER, address VARCHAR, city VARCHAR, province VARCHAR);
INSERT INTO APARTMENTS VALUES (16001, 1, 1, 850, '123 King St. East', 'Toronto', 'ON');
INSERT INTO APARTMENTS VALUES (16002, 2, 1, 1000, '1023 Yonge Ave.', 'Toronto', 'ON');
INSERT INTO APARTMENTS VALUES (16003, 2, 2, 1050, '27 Winchester St.', 'Toronto', 'ON');
4.Apertment.java
鏅氱殑javabean
5.DBUtils.java
聽聽聽鏁版嵁搴撻摼鎺ョ被
聽聽 public class DBUtils {
聽/*
聽 * Creates the sample data (table and records).
聽 */
聽public static void setupDatabase(BufferedReader reader) {
聽聽Connection c = null;
聽聽Statement stmt = null;
聽聽try {
聽聽聽c = openConnection();
聽聽聽stmt = c.createStatement();
聽聽聽// reads the file with the SQL statements
聽聽聽String line;
聽聽聽while ((line = reader.readLine()) != null) {
聽聽聽聽stmt.execute(line);
聽聽聽}
聽聽聽stmt.close();
聽聽聽c.close();
聽聽} catch (IOException e) {
聽聽聽e.printStackTrace();
聽聽} catch (SQLException e) {
聽聽聽e.printStackTrace();
聽聽} finally {
聽聽聽try {
聽聽聽聽stmt.close();
聽聽聽聽c.close();
聽聽聽} catch (SQLException e) {
聽聽聽聽e.printStackTrace();
聽聽聽}
聽聽}
聽}
聽
聽/*
聽 * Opens a database connection.
聽 */
聽public static Connection openConnection() throws SQLException {
聽聽Connection c = DriverManager.getConnection("jdbc:hsqldb:mem:dwr-sample", "sa", "");
聽聽return c;
聽}
聽
}
6.ContextListener.java
聽聽 瀹炵幇浜哠ervletContextListerer鎺ュ彛鐨勭被
聽聽 public class ContextListener implements javax.servlet.ServletContextListener {
聽/**
聽 * This method is invoked when the Web Application has been removed and is
聽 * no longer able to accept requests.
聽 * @param event
聽 */
聽public void contextDestroyed(ServletContextEvent event) {
聽}
聽/**
聽 * This method is invoked when the Web Application is ready to service requests.
聽 * @param event
聽 */
聽public void contextInitialized(ServletContextEvent event) {
聽聽try {
聽聽聽// load the driver
聽聽聽Class.forName("org.hsqldb.jdbcDriver");
聽聽聽// create the table and add sample data
聽聽聽InputStreamReader in = new InputStreamReader(getClass().getClassLoader().getResourceAsStream("db.sql"));
聽聽聽BufferedReader reader = new BufferedReader(in);
聽聽聽DBUtils.setupDatabase(reader);
聽聽} catch (ClassNotFoundException e) {
聽聽聽e.printStackTrace();
聽聽}
聽聽
聽}
}
7.ApartmentDAO.java
聽聽 涓氬姟閫昏緫灞?br />聽聽 public class ApartmentDAO {
聽
聽/**
聽 * Returns the available apartments based on the search criteria.
聽 * @param bedrooms minimum number of bedrooms
聽 * @param bathrooms minimum number of bathrooms
聽 * @param price maximum price to be paid
聽 * @return
聽 */
聽public Collection findApartments(int bedrooms, int bathrooms, int price) {
聽聽Collection list = new Vector();
聽聽String sql = "select * from APARTMENTS" +
聽聽聽聽createSearchWhereClause(bedrooms, bathrooms, price) +
聽聽聽聽"order by bedrooms, bathrooms, price";
聽聽// define db variables
聽聽Connection c = null;
聽聽Statement stmt = null;
聽聽try {
聽聽聽c = DBUtils.openConnection();
聽聽聽stmt = c.createStatement();
聽聽聽// just run the sql statement
聽聽聽ResultSet rs = stmt.executeQuery(sql);
聽聽聽while(rs.next()) {
聽聽聽聽Apartment apartment = this.getApartment(rs);
聽聽聽聽list.add(apartment);
聽聽聽}
聽聽} catch (SQLException e) {
聽聽聽e.printStackTrace();
聽聽} finally {
聽聽聽try {
聽聽聽聽stmt.close();
聽聽聽聽c.close();
聽聽聽} catch (SQLException e) {
聽聽聽聽e.printStackTrace();
聽聽聽}
聽聽}
聽聽return list;
聽}
聽
聽/**
聽 * Returns the number of available apartments based on the search criteria.
聽 * @param bedrooms minimum number of bedrooms
聽 * @param bathrooms minimum number of bathrooms
聽 * @param price maximum price to be paid
聽 * @return
聽 */
聽public int countApartments(int bedrooms, int bathrooms, int price) {
聽聽String sql = "select count(*) as total from APARTMENTS" + createSearchWhereClause(bedrooms, bathrooms, price);
聽聽int numberApartments = -1;
聽聽// define db variables
聽聽Connection c = null;
聽聽Statement stmt = null;
聽聽try {
聽聽聽c = DBUtils.openConnection();
聽聽聽stmt = c.createStatement();
聽聽聽// just run the sql statement
聽聽聽ResultSet rs = stmt.executeQuery(sql);
聽聽聽if (rs.next()) {
聽聽聽聽numberApartments = rs.getInt("total");
聽聽聽}
聽聽} catch (SQLException e) {
聽聽聽e.printStackTrace();
聽聽} finally {
聽聽聽try {
聽聽聽聽stmt.close();
聽聽聽聽c.close();
聽聽聽} catch (SQLException e) {
聽聽聽聽e.printStackTrace();
聽聽聽}
聽聽}
聽聽
聽聽return numberApartments;
聽}
聽
聽/**
聽 * Creates a Unit object from the database.
聽 * @param rs
聽 * @return
聽 * @throws SQLException
聽 */
聽private Apartment getApartment(ResultSet rs) throws SQLException {
聽聽Apartment ap = new Apartment();
聽聽ap.setId(rs.getInt("id"));
聽聽ap.setAddress(rs.getString("address"));
聽聽ap.setBedrooms(rs.getInt("bedrooms"));
聽聽ap.setBathrooms(rs.getInt("bathrooms"));
聽聽ap.setPrice(rs.getInt("price"));
聽聽ap.setCity(rs.getString("city"));
聽聽ap.setProvince(rs.getString("province"));
聽聽return ap;
聽}
聽
聽
聽/**
聽 * Creates the where clause for the search SQL statement.
聽 * @param bedrooms
聽 * @param bathrooms
聽 * @param price
聽 * @return
聽 */
聽private String createSearchWhereClause(int bedrooms, int bathrooms, int price) {
聽聽String where = " where bedrooms >= " + bedrooms +
聽聽聽聽" and bathrooms >= " + bathrooms +
聽聽聽聽" and price < " + price;
聽聽return where;
聽}
}
8. search.jsp
聽 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
聽 <title>DWR Example</title>
聽聽 <style type="text/css" media="screen">
聽聽聽聽聽聽 @import url( style.css );
聽聽 </style>聽
聽
聽 <script src='dwr/interface/ApartmentDAO.js'></script>
聽 <script src='dwr/engine.js'></script>
聽 <script src='dwr/util.js'></script>
聽 <script>
聽
聽 function updateTotal() {
聽聽聽 $("resultTable").style.display = 'none';
聽聽聽 var bedrooms = document.getElementById("bedrooms").value;
聽聽聽 var bathrooms = document.getElementById("bathrooms").value;
聽聽聽 var price = document.getElementById("price").value;
聽聽聽 ApartmentDAO.countApartments(loadTotal, bedrooms, bathrooms, price);
聽 }
聽 function updateResults() {
聽聽聽 DWRUtil.removeAllRows("apartmentsbody");
聽聽聽 var bedrooms = document.getElementById("bedrooms").value;
聽聽聽 var bathrooms = document.getElementById("bathrooms").value;
聽聽聽 var price = document.getElementById("price").value;
聽聽聽 ApartmentDAO.findApartments(fillTable, bedrooms, bathrooms, price);
聽聽聽 $("resultTable").style.display = '';
聽 }
聽
聽 var getId = function(unit) { return unit.id };
聽 var getAddress = function(unit) { return unit.address };
聽 var getBedrooms = function(unit) { return unit.bedrooms };
聽 var getBathrooms = function(unit) { return unit.bathrooms };
聽 var getPrice = function(unit) { return unit.price };
聽聽聽
聽 function loadTotal(data) {
聽聽聽 document.getElementById("totalRecords").innerHTML = data;
聽 }
聽
聽 function fillTable(apartment) {
聽聽聽 DWRUtil.addRows("apartmentsbody", apartment, [ getId, getAddress, getBedrooms, getBathrooms, getPrice ]);
聽 }
聽
</script>
</head>
<body onload="updateTotal();">
<h2>Find an apartment to rent</h2>
<table border="0">
<form name="rentalForm">
聽 <tr width="400">
聽聽 <td width="100">City</td>
聽聽 <td width="300">Toronto</td>
聽 </tr>
聽 <tr>
聽聽 <td>Beds</td>
聽聽 <td>
聽聽聽 <select id="bedrooms" onchange="updateTotal()">
聽聽聽聽 <option value="1">1 or more</option>
聽聽聽聽 <option value="2">2 or more</option>
聽聽聽聽 <option value="3">3 or more</option>
聽聽聽聽 <option value="4">4 or more</option>
聽聽聽 </select>
聽聽 </td>
聽 </tr>
聽 <tr>
聽聽 <td>Baths</td>
聽聽 <td>
聽聽聽 <select id="bathrooms" onchange="updateTotal()">
聽聽聽聽 <option value="1">1 or more</option>
聽聽聽聽 <option value="2">2 or more</option>
聽聽聽聽 <option value="3">3 or more</option>
聽聽聽聽 <option value="4">4 or more</option>
聽聽聽 </select>
聽聽 </td>
聽 </tr>
聽 <tr>
聽聽 <td>Price</td>
聽聽 <td>
聽聽聽 <select id="price" onchange="updateTotal()">
聽聽聽聽 <option value="800">under $800</option>
聽聽聽聽 <option value="1000">under $1,000</option>
聽聽聽聽 <option value="1250">under $1,250</option>
聽聽聽聽 <option value="1500" selected="selected">under $1,500</option>
聽聽聽聽 <option value="1800">under $1,800</option>
聽聽聽聽 <option value="2000">under $2,000</option>
聽聽聽 </select>
聽聽 </td>
聽 </tr>
聽 <tr>
聽聽 <td colspan="2">
聽聽聽 <blockquote>
聽聽聽聽 Available apartments: <span id="totalRecords" style="font-weight:bold;"></span>
聽聽聽 </blockquote>
聽聽 </td>
聽 </tr>
</form>
</table>
<p><input type="button" value="Show results!" onClick="updateResults();"></p>
<div id="resultTable">
<h2>Results</h2>
聽<table border="1">
聽 <thead>
聽聽聽 <tr>
聽聽聽聽聽 <th width="40">Id</th>
聽聽聽聽聽 <th width="180">Address</th>
聽聽聽聽聽 <th width="60">Beds</th>
聽聽聽聽聽 <th width="60">Baths</th>
聽聽聽聽聽 <th width="60">Price</th>
聽聽聽 </tr>
聽 </thead>
聽 <tbody id="apartmentsbody">
聽 </tbody>
聽</table>
</div>
</body>
</html>
鐢變簬欏圭洰闇瑕?闇鍦ㄦ垜浠幇鏈夌殑struts銆乭ibernate宸ョ▼涓婇泦鎴恆jax鍔熻兘.欏圭洰緇勫喅瀹氫嬌鐢―wr.
鍒氬紑濮嬬爺絀禗wr.瑙夊緱鐪熺殑寰堜笉閿? 鍙渶寰堝皯閲忕殑浠ｇ爜,灝辮兘鍦ㄧ幇鏈夌殑宸ョ▼涓婇泦鎴恆jax鎶鏈? 鏈熷緟Dwr鏈夋洿杈夌厡鐨勬槑澶╋紒
鍠滄Dwr鎶鏈殑IT鐣屾湅鍙嬪彲浠ヤ笌鏈漢鑱旂郴錛佹湜鎻愬嚭濂界殑鎰忚涓庡緩璁?
]]>
銆銆鍥犵壒緗戜笂璁稿渚嬪瓙灞曠ず浜嗗湪涓涓狧TML鏂囦歡鍐呴儴浣跨敤XMLHttpRequest涓庢湇鍔″櫒绔繘琛屼氦浜掔殑蹇呰鐨勬楠ゃ傚綋鎵嬪伐鍦扮紪鍐欏拰緇存姢XMLHttpRequest浠ｇ爜鏃訛紝寮鍙戣呭繀欏誨鐞嗚澶氭綔鍦ㄧ殑闂錛岀壒鍒槸綾諱技浜庤法嫻忚鍣ㄧ殑DOM瀹炵幇鐨勫吋瀹規ц繖鏍風殑闂銆傝繖灝嗕細瀵艱嚧鍦ㄧ紪鐮佸拰璋冭瘯Javascript浠ｇ爜涓婇潰鑺辮垂鏁頒笉娓呯殑鏃墮棿錛岃繖鏄劇劧瀵瑰紑鍙戣呮潵璇村緢涓嶅弸濂姐?/font>
銆銆DWR(鐩存帴Web榪滅▼鎺у埗)欏圭洰鏄湪Apache璁稿彲涓嬬殑涓涓紑婧愮殑瑙ｅ喅鏂規錛屽畠渚涚粰閭ｄ簺鎯寵浠ヤ竴縐嶇畝鍗曠殑鏂瑰紡浣跨敤Ajax鍜孹MLHttpRequest鐨勫紑鍙戣呫傚畠鍏鋒湁涓濂桱avascript鍔熻兘闆嗭紝瀹冧滑鎶婁粠HTML欏甸潰璋冪敤搴旂敤鏈嶅姟鍣ㄤ笂鐨凧ava瀵硅薄鐨勬柟娉曠畝鍖栦簡銆傚畠鎿嶆帶涓嶅悓綾誨瀷鐨勫弬鏁幫紝騫跺悓鏃朵繚鎸佷簡HTML浠ｇ爜鐨勫彲璇繪с?br />涓. Util.js
聽聽聽聽聽 util.js鍖呭惈涓緋誨垪鐨勫伐鍏峰嚱鏁頒嬌鐢╦avascript榪斿洖鐨勬暟鎹潵甯姪鏇存柊Web欏甸潰銆?br />util.js涓湁鍥涚鍩烘湰鐨勯〉闈㈡搷浣滃嚱鏁?
getValue[s];setValue[s]鍙互鍜岄櫎榪噒ables銆乴ists銆乮mages鐨勫ぇ閮ㄥ垎鐨刪tml鍏冪礌浜や簰.
getText()鍙互鍜岄夋嫨鍒楄〃(select lists)浜や簰.
緙栬緫tables鐢╝ddRows()鍜宺emoveAllRows()鏂規硶.緙栬緫鍒楄〃(閫夋嫨lists鍜寀l,ol鍒楄〃)鐢?br />addOptions()鍜宺emoveAllOptions().
1.${}
聽 ${}鍑芥暟鏄竴涓?javascript)鍏ㄥ眬鍙橀噺.
聽 $=document.getElementById
聽 '$'鍙互閫氳繃緇欏畾鐨?ID'鍙栧緱HTML鏂囨。鍏冪礌.浠栦篃鍙繑鍥炰竴涓寘鍚繑鍥炲厓绱犵殑鏁扮粍.
2.Generating Lists
聽 DWRUtil.addOptions()鎻忚堪浜嗕笅鎷夊垪琛ㄧ殑瀹炵幇
聽 var sel = DWRUtil.getValue(id);
聽 DWRUtil.removeAllOptions(id);
聽 DWRUtil.addOptions(id,...);
聽 DWRUtil.setValue(id,sel);
聽 濡傛灉鎯寵娣誨姞"璇烽夋嫨..."欏?鍙互娣誨姞浠ヤ笅欏? DWRUtil.addOptions(id,["Please select ..."]);
聽 DWRUtil.addOptions鏈夊洓縐嶄嬌鐢ㄦā寮?
聽 Array:
聽聽聽聽聽聽 DWRUtil.addOptions(selectid,array)鍜岀敤鏂囨湰鍜屽煎垱寤轟簡閫夋嫨鍒楄〃.
聽 Array of Objects(using option text = option value):
聽聽聽聽聽聽 DWRUtil.addOptions(selectid,data,prop)鐢ㄦ暟緇勫厓绱犲垱寤轟簡閫夋嫨鍒楄〃,閫夋嫨鍒楄〃涓殑鍊煎拰鏂囨湰璁懼畾涓?br />聽聽聽聽聽聽 鏁扮粍涓殑姣忎釜瀵硅薄鐨勫睘鎬?
聽 Array of objects(with differing option text and value):
聽聽聽聽聽聽 DWRUtil.addOptions(selectid,array,valueprop,textprop)
聽 Object:
聽聽聽聽聽聽 DWRUtil.addOptions(selectid,map,reverse)
聽 Map of object:
聽聽聽聽聽聽 DWRUtil.addOptions(ulid,array)
聽
]]>
]]>
]]>
2006-7-19 鍙戝竷鐨刧wt鐨勫彲瑙嗗寲寮鍙戝伐鍏?----聽聽 VistaFei
鐗圭偣錛?br />1錛屽熀浜巈clipse
2錛屽彲浠ヨ嚜鐢辨嫋鏀劇粍浠?br />3錛屾病鏈夎鏄惁鍏嶈垂
4錛岃繖涓増鏈浜庡垵瀛wt鐨勪漢寰堟湁甯姪錛屼絾瀵逛簬鐪熷疄鐨勫簲鐢ㄨ繕涓嶈
涓婚〉錛歨ttp://www.wirelexsoft.com/
涓嬭澆鍦板潃錛歨ttp://www.wirelexsoft.com/wforum/viewtopic.php?t=48
瑕佹敞鍐岀敤鎴鋒墠鍙互涓嬭澆
]]>
ZK 鏄竴涓熀浜嶺UL宓屽叆AJAX浜嬩歡椹卞姩鐨凧ava 妗嗘灦錛岀敤浜庝赴瀵岀敤鎴風綉緇滃簲鐢ㄧ▼搴忕晫闈€?/p>
鏂扮増鏈腑澧炲姞浜?5涓柊鐗規э紝淇ˉ浜?9涓猙ug錛屽寘鎷琩irective銆乮mport銆乧omponent銆乻tyle銆乪vent銆佽嚜瀹氫箟閿欒欏甸潰絳夌瓑銆?CSDN)
]]>
聽聽聽聽
]]>