Group Blog
 
All Blogs
 

Java Programming Bookstore Appication (Series 5.1): Building a Web Application Using Struts 2

จาก Java Programming Bookstore Appication (Series 5): Building a Web Application Using Struts 2 เราจะแก้ไข HelloWorld project ให้สามารถรับค่าและแสดงผลได้อย่างง่ายๆ กันก่อนครับ สิ่งที่เราต้องทำคือต้องสร้างคลาสสำหรับ action และมีหน้าจอในการกรอกชื่อ และส่วนของการแสดงผล เริ่มต้นที่หน้าจอกรอกข้อมูลกันตามตัวอย่างที่ 1 เป็นการแก้ไขไฟล์ index.jsp 


ตัวอย่างที่ 1 index.jsp
<html >
<body>
<form action= "hello">
<label for= "name">Enter your name label> < br /> < input type ="text"
name= "name" /> < input type ="submit" value= "Submit" />
form>
body>
html>

จากตัวอย่างที่ 1
  • เมื่อเรากดปุ่ม Submit หน้าจอจะมีการเรียก action hello และจะถูกส่งไปยัง container
เมื่อมีการเพิ่ม action เราจำเป็นต้อง map URL Pattern เพิ่มที่ไฟล์ struts.xml ซึ่งจากโปรเจ็คเดิมเราจะ config ไว้แค่ action index ที่จะไปเรียก index.jsp เพื่อแสดงผล ให้แก้ไขไฟล์ struts.xml ตามตัวอย่างที่ 2

ตัวอย่างที่ 2 struts.xml
xml version= "1.0" encoding ="UTF-8"?>
DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>
<constant name= "struts.devMode" value ="true" />
<package name= "basicstruts2" extends ="struts-default"
namespace="/" >
<action name= "index">
<result> /index.jspresult >
action>

<action name= "hello" class="com.apress.helloworld.action.HelloWorldAction"
method= "execute">
<result name= "success">/hello.jsp result>
action>
package>
struts>


จากตัวอย่างที่ 2
  • action name ชื่อ hello จะถูก map ไปยังคลาส HelloWorldAction (ยังไม่สร้าง) และจะเรียกใช้เมธอด execute 
  • เมื่อรันสำเร็จจะถูกส่งไปยังหน้าจอที่ชื่อ hello.jsp
ต่อไปเราจำเป็นต้องสร้าง action คลาสขึ้นมาชื่อว่า HelloWorldAction ตามรูปที่ 1 เมื่อกดปุ่ม Finish จะได้ผลตามรูปที่ 2


รูปที่ 1


ให้เราแก้ไขไฟล์ HelloWorldAction ตามตัวอย่างที่ 3

รูปที่ 2


ตัวอย่างที่ 3 HelloWorldAction.java
package com.apress.helloworld.action;

public class HelloWorldAction {

private String name ;

public String execute() throws Exception {
return "success" ;
       }

public String getName() {
return name ;
       }

public void setName(String name) {
this.name = name;
       }
}

จากตัวอย่างที่ 3
  • เมธอด execute() จะถูกเรียกโดย user action ที่ได้ config ไปตามตัวอย่างที่ 2 และ return "success" จะถูกส่งต่อไปยัง hello.jsp (ตัวอย่างที่ 4) ตาม config ไฟล์ที่ชื่อ struts.xml
ให้เราสร้างไฟล์ hello.jsp ที่ path helloWorldStruts2/src/main/webapp และแก้ไขตามตัวอย่างที่ 4

ตัวอย่างที่ 4 hello.jsp
<%@ page language= "java" contentType ="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1" %>

<%@ taglib prefix="s" uri= "/struts-tags"%>
DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd" >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title> Hello Worldtitle >
head>
<body>
       Hello your name is
<s:property value= "name" />
body>
html>


จากตัวอย่างที่ 4
  • taglib คือ directive ที่บอกให้ servlet container รู้ว่า jsp นี้จะเรียกใช้งาน tags ของ Struts 2 
  • s:property tag จะเป็นตัวแสดงค่าที่ได้จากเมธอด getName จากคลาส HelloWorldAction
ทดสอบโดยการ start Tomcat server และเรียก http://localhost:8080/helloWorldStruts2/ จะปรากฏหน้าจอดังรูปที่ 3

รูปที่ 3


พิมพ์ชื่อ แล้วกดปุ่ม Submit จะได้ผลตามรูปที่ 4

รูปที่ 4


เราจะเริ่มสร้าง Bookstore Application ในตอนต่อไป

Java Programming Bookstore Application (Series 5.2): Building a Web Application Using Struts 2





ตอนต่อไปติดตามได้ที่


Java Programming Bookstore Application (Series 5): Building a Web Application Using Struts 2

Java Programming Bookstore Application (Series 6): Building Java Web Applications with Spring Web MVC

Java Programming Bookstore Application (Series 7): Component-Based Web Development Using JSF 2

Java Programming Bookstore Application (Series 8): Rapid Web Development with Grails

Java Programming Bookstore Application (Series 9): Play with Java and Scala



อ้างอิง

ผู้เขียน: procodeblog




 

Create Date : 16 พฤศจิกายน 2557    
Last Update : 16 พฤศจิกายน 2557 15:17:27 น.
Counter : 104 Pageviews.  

Java Programming Bookstore Appication (Series 5): Building a Web Application Using Struts 2





ใน series ต่อไปนี้เราจะลองใช้ struts 2 กันเบื้องต้นโดยเขียน HelloWorld กันจะมีการใช้ tool ที่เรียกว่า Maven ด้วยครับ Maven เป็น command-line tool ใช้ในการ build และ package project รวมถึงช่วยเรื่อง manage dependencies ช่วยให้เราพัฒนา project ต่างๆ ได้ง่ายขึ้น ซึ่งเราจะใช้ไฟล์ชื่อ pom.xml ในการ config ค่าต่างๆ ในบทความนี้เราจะใช้ Maven 4 ซึ่งบรรจุอยู่ใน Eclipse-kepler อยู่แล้ว (การพัฒนาโปรแกรม Java ด้วย Eclipse IDE for Windows 64-bit)

เริ่มต้นสร้าง Maven Project ตามรูปที่ 1 ให้เปิด eclipse เลือกเมนู File > New > Other...
จะปรากฏหน้าจอตามรูปที่ 2

รูปที่ 1


จการูปที่ 2 ให้เลือกโฟลเดอร์ Maven > Maven Project แล้วกดปุ่ม Next >  

รูปที่ 2


จะได้ผลตามรูปที่ 3 จากนั้นกดปุ่ม Next > 

รูปที่ 3



ให้เลือกตามรูปที่ 4 เป็นการเลือก template ของการสร้างเว็บแบบง่ายๆ แล้วกดปุ่ม Next > 

รูปที่ 4


ให้กรอกข้อมูลตามรูปที่ 5 แล้วกดปุ่ม Finish

รูปที่ 5


เราจะได้โครงสร้าง project ตามรูปที่ 6 

รูปที่ 6


จากนั้นเราจำเป็นต้องเพิ่ม struts 2-core dependency ในไฟล์ config ที่ชื่อว่า pom.xml ตามตัวอย่างที่ 1 (ส่วนที่เป็นสีส้มคือ code ที่เพิ่ม)

ตัวอย่างที่ 1 pom.xml
<project xmlns= "http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
<modelVersion> 4.0.0 modelVersion>
<groupId> com.apressgroupId >
<artifactId> helloWorldStruts2artifactId >
<packaging> war packaging>
<version> 0.0.1-SNAPSHOTversion >
<name> helloWorldStruts2 Maven Webappname >
<url> http://maven.apache.orgurl >
<dependencies>
<dependency>
<groupId> junitgroupId >
<artifactId> junitartifactId >
<version> 3.8.1 version>
<scope> test scope>
dependency>
<dependency>
<groupId> org.apache.strutsgroupId >
<artifactId> struts2-coreartifactId >
<version> 2.3.16.3 version>
<type> jar type>
<scope> compile scope>
dependency>
dependencies>
<build>
<finalName> helloWorldStruts2finalName >
build>
project>


จากนั้นให้เราทำการแก้ไข web.xml ซึ่งก็คือ deployment descriptor โดยเราจำเป็นต้อง config servlet filter ขึ้นตามตัวอย่างที่ 2

ตัวอย่างที่ 2 web.xml
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>
<display-name> Hello World Struts 2 Web Applicationdisplay-name >
<filter>
<filter-name> struts2 filter-name>
<filter-class> org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter filter-class>
filter>

<filter-mapping>
<filter-name> struts2 filter-name>
<url-pattern> /* url-pattern>
filter-mapping>
web-app>

จากตัวอย่างที่ 2
  • StrutsPrepareAndExecuteFilter จะทำหน้าที่เป็น servlet filter ตาม URL pattern ที่เราได้ map ไว้
ต่อไปให้สร้างไฟล์ struts.xml (สร้างโฟลเดอร์ classes ใต้โฟลเดอร์ WEB-INF แล้วสร้างไฟล์ struts.xml ใต้ classes อีกที)  ตามรูปที่ 7

รูปที่ 7


รูปที่ 8 


จากรูปที่ 8 ให้เลือกโฟลเดอร์ XML > XML File แล้วกดปุ่ม Next >
ต่อไปให้ตั้งชื่อไฟล์ว่า struts.xml แล้วกดปุ่ม Finish

รูปที่ 9


ให้แก้ไขไฟล์ struts.xml ตามตัวอย่างที่ 2


ตัวอย่างที่ 2 struts.xml
xml version= "1.0" encoding ="UTF-8"?>
DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">

<struts>
<constant name= "struts.devMode" value ="true" />
<package name= "basicstruts2" extends ="struts-default">
<action name= "index">
<result> /index.jspresult >
action>
package>
struts>

จากตัวอย่างที่ 2
  • action name index จะทำการ render หน้า index.jsp (ตามรูปที่ 6 ถูกสร้างตั้งแต่ตอนสร้างโปรเจ็ค) เมื่อมีการเรียก action นี้

ให้เรา deploy web application ไปยัง Tomcat server ที่เรา set ไว้ตั้งแต่ series 4 (Java Programming Bookstore Application (Series 4): Building Web Applications Using Servlets and JSP

ก่อน run project ให้เรา คลิกเมาส์ขวาที่ไฟล์ pom.xml และเลือก Run As > Maven install ให้สังเกตที่ console tab ตามรูปที่ 11

รูปที่ 10


รอจน eclipse download dependency จนสำเร็จตามรูปที่ 11

รูปที่ 11


จากนั้นลอง start Tomcat Server แล้วทดสอบกัน http://localhost:8080/helloWorldStruts2/
ได้ผลตามรูปที่ 12

รูปที่ 12


เมื่อได้ผลตามรูปที่ 12 เราก็แน่ใจได้ว่าเรา config ถูกต้องแล้ว ต่อไปเราจะให้ HelloWorld Project ของเราแสดงข้อความยินดีต้อนรับผู้ใช้งานกัน

Java Programming Bookstore Appication (Series 5.1): Building a Web Application Using Struts 2

ตอนต่อไปติดตามได้ที่


Java Programming Bookstore Appication (Series 5.1): Building a Web Application Using Struts 2

Java Programming Bookstore Application (Series 6): Building Java Web Applications with Spring Web MVC

Java Programming Bookstore Application (Series 7): Component-Based Web Development Using JSF 2

Java Programming Bookstore Application (Series 8): Rapid Web Development with Grails

Java Programming Bookstore Application (Series 9): Play with Java and Scala



อ้างอิง

ผู้เขียน: procodeblog




 

Create Date : 15 พฤศจิกายน 2557    
Last Update : 15 พฤศจิกายน 2557 16:45:03 น.
Counter : 431 Pageviews.  

Java Programming Bookstore Appication (Series 1): Data Model for the Bookstore Application

Java Programming Bookstore Appication (Series 1): Data Model for the Bookstore Application

ตอนนี้จะเป็นบทความที่พูดถึงเรื่องข้อมูลของระบบการจัดการหนังสือ (Bookstore Application) ซึ่งระบบนี้จะประกอบไปด้วย 3 ตาราง
  • CATEGORY - ตารางสำหรับเก็บประเภทของหนังสือ; เช่น Java, Scala
  • BOOK - ตารางสำหรับเก็บรายละเอียดหนังสือ เช่น ชื่อเรื่อง
  • AUTHOR - ตารางสำหรับเก็บรายละเอียดผู้เขียน
จากรูปที่ 1 ประเภทหนังสือ (CATEGORY) แต่ละประเภทนั้นสามารถจัดหนังสือเข้าประเภทได้มากกว่า 1 เล่ม หรือไม่มีหนังสือใดๆจัดเข้าประเภทนั้นๆเลยก็ได้ เช่น หนังสือประเภท Java อาจจะมีอยู่สามเล่ม หรือไม่มีเลยก็ได้ อาจกล่าวได้อีกอย่างว่า ระหว่าง ประเภทหนังสือ (CATEGORY) และ หนังสือ (BOOK) นั้นมีความสัมพันธ์กันแบบ one-to-many เช่นเดียวกับความสัมพันธ์ระหว่าง หนังสือ (BOOK) กับผู้เขียน (AUTHOR) ซึ่งตามรูปที่ 1 เราจะเรียกว่า ER Diagram (The entity-relationship diagram)


รูปที่ 1


ซึ่งในบทความนี้จะใช้ฐานข้อมูลแบบ DBMS (Data Base Management System) นั่นคือ MySQL เป็นตัวอย่างเนื่องจากฟรี และเป็นที่แพร่หลาย ก่อนใช้งานต้องมีการติดตั้ง MySQL กันก่อนนะครับ
เมื่อติดตั้งสำเร็จเรามาเริ่มสร้างฐานข้อมูล (database) กันเลย ใช้คำสั่งนี้ครับ

create database books;

เมื่อสร้าง database แล้วให้เราเรียกใช้ด้วยคำสั่ง

use books;

หลังจากนี้เราสามารถสร้างตาราง (Table) ได้แล้วตามตัวอย่างที่ 1

ตัวอย่างที่ 1 สร้าง Table สำหรับ database Bookstore
CREATE TABLE CATEGORY (ID INT NOT NULL AUTO_INCREMENT ,CATEGORY_DESCRIPTION VARCHAR(20) NOT NULL ,PRIMARY KEY (ID));

CREATE TABLE BOOK (ID INT NOT NULL AUTO_INCREMENT,CATEGORY_ID INT NOT NULL ,BOOK_TITLE VARCHAR(60) NOT NULL,PUBLISHER VARCHAR(60) NOT NULL ,PRIMARY KEY (ID) ,CONSTRAINT FK_BOOK_1 FOREIGN KEY (CATEGORY_ID) REFERENCES CATEGORY(ID));

CREATE TABLE AUTHOR (ID INT NOT NULL AUTO_INCREMENT ,BOOK_ID INT NOT NULL ,FIRST_NAME VARCHAR(20) NOT NULL ,LAST_NAME VARCHAR(20) NOT NULL ,PRIMARY KEY (ID) ,CONSTRAINT FK_AUTHOR_1 FOREIGN KEY (BOOK_ID) REFERENCES BOOK (ID));

เราสามารถตรวจสอบการสร้าง Table โดยใช้คำสั่ง

show tables;

จะได้ผลลัพธ์ตามรูปที่ 2

รูปที่ 2

เราสามารถดูโครงสร้าง Table ได้โดยการใช้คำสั่ง

describe
หรือ
desc

จะได้ผลลัพธ์ตามรูปที่ 3

รูปที่ 3

เรามาลองเพิ่มข้อมูลลง Table กันไว้สำหรับใช้พัฒนากันใน series ต่อไป

insert into category (category_description) values ('Clojure');insert into category (category_description) values ('Groovy');

insert into category (category_description) values ('Java');insert into category (category_description) values ('Scala');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (1, 'Practical Clojure', 'Apress');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (2, 'Beginning Groovy, Grails and Griffon', 'Apress');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (2, 'Definitive Guide to Grails 2', 'Apress');insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (2, 'Groovy and Grails Recipes', 'Apress');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (3, 'Modern Java Web Development', 'Apress');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (3, 'Java 7 Recipes', 'Apress');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (3, 'Java EE 7 Recipes', 'Apress');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (3, 'Beginning Java 7 ', 'Apress');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (3, 'Pro Java 7 NIO.2', 'Apress');insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (3, 'Java 7 for Absolute Beginners', 'Apress');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (3, 'Oracle Certified Java Enterprise Architect Java EE7', 'Apress');

insert into Book (CATEGORY_ID, BOOK_TITLE, PUBLISHER) values (4, 'Beginning Scala', 'Apress');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (1, 'Luke', 'VanderHart');insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (2, 'Vishal', 'Layka');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (3, 'Jeff', 'Brown');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (4, 'Bashar', 'Jawad');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (5, 'Vishal', 'Layka');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (6, 'Josh', 'Juneau');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (7, 'Josh', 'Juneau');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (8, 'Jeff', 'Friesen');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (9, 'Anghel', 'Leonard');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (10, 'Jay', 'Bryant');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (11, 'B V', 'Kumar');

insert into Author (BOOK_ID, FIRST_NAME, LAST_NAME) values (12, 'David', 'Pollak');

เราสามารถเรียกดูข้อมูลที่ได้ทำการเพิ่มลง Table ได้ตามตัวอย่างในรูปที่ 4

รูปที่ 4

ตอนต่อไปติดตามได้ที่


อ้างอิง
ผู้เขียน: procodeblog




 

Create Date : 07 พฤศจิกายน 2557    
Last Update : 7 พฤศจิกายน 2557 22:18:04 น.
Counter : 106 Pageviews.  


เด็กขงเบ้ง
Location :
กรุงเทพฯ Thailand

[Profile ทั้งหมด]

ให้ทิปเจ้าของ Blog [?]
ฝากข้อความหลังไมค์
Rss Feed
Smember
ผู้ติดตามบล็อก : 1 คน [?]




Friends' blogs
[Add เด็กขงเบ้ง's blog to your web]
Links
 

 Pantip.com | PantipMarket.com | Pantown.com | © 2004 BlogGang.com allrights reserved.