Scribd
Upload
89 views23 pages

A Tutorial On Project Assignm Ent: Bing Wang

This document provides instructions for setting up a student registration system demo project in Eclipse using Java, Java Server Pages (JSP), JavaScript, HTML, and MySQL. It discusses developing the graphical user interface (GUI) using HTML and JavaScript, using JSP to integrate Java code on web pages, and connecting to a MySQL database using JDBC. The document includes code examples and step-by-step instructions for running the demo project.

Uploaded by

Fei Kou
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
89 views23 pages

A Tutorial On Project Assignm Ent: Bing Wang

This document provides instructions for setting up a student registration system demo project in Eclipse using Java, Java Server Pages (JSP), JavaScript, HTML, and MySQL. It discusses developing the graphical user interface (GUI) using HTML and JavaScript, using JSP to integrate Java code on web pages, and connecting to a MySQL database using JDBC. The document includes code examples and step-by-step instructions for running the demo project.

Uploaded by

Fei Kou
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 23

A Tutorial on Project Assignm

ent
BING WANG
Contents
 DEMO
 SETTING UP YOUR ENVIRONMENT
 RUN THE DEMO
 DEVELOPING A GUI
› HTML
› JAVASCRIPT
 JSP
 JDBC
DEMO
 Student Registration system
› PROFESSOR
› STUDENT
› COURSE
› TRANSCRIPT
Setting up Your Environment

 •Install Eclipse
› Integrated Development Environment

 •Install Java SDK

 •Install Apache Tomcat

 Create Sample Web Application


› Helios/Callisto
Setting up Your Environment
 Apache Tomcat

› application server

› renders Web pages which includes Java Server Page


coding

› If you are going to be running Java Code in the f


orm of Java Server Pages on your web server, you
will need an appropriate software to act as a con
tainer
Setting up Your Environment
 Apache Tomcat

› provides a Java Virtual Machine and associated eleme


nts to give a complete Java Runtime Environment.

› provides web server software to make the environment


accessible on the Web.

› You can get everything you want from the link below:

› http://tomcat.apache.org/
Setting up Your Environment

 You Also need Connector/J for JDBC to c


onnect MySQL
 Download Connector/J from
http://dev.mysql.com/downloads/connecto
r/j/
 Copy it under WebContent/WEB-INF/lib
 Already done in the war file
Run the Demo

 Install MySQLQuery Browser

 http://www.cs.sunysb.edu/facilities/win
dowslab/services/mysql.html

 Copy/Paste the contents of Java Resourc


es/initdb.sql to the scripting window a
nd execute
Run the Demo

 Go to File->Import->WAR file

 Select the WAR to import

 •Replace username with your netID in all jsp files

 •Replace password with your SBU ID

 •Project->Run As->Run on Server

 •Go to
Developing A GUI
 Graphical User Interface
 a type of user interface that allows us
ers to interact with programs in more w
ays than typing
 offers graphical icons, and visual indi
cators
Developing A GUI

 You can learn the basic things about HTML here:


http://www.w3schools.com/html/

 Use HTML pages to develop GUI and add appropria


te elements (button, textfield, radio buttom) t
o take the user’s input and output your comput
ing result on the screen
 Some recommended developing tools for HTML: Mic
rosoft Visual Studio 2005, UltraEdit, Microsoft
Front Page, etc.
Developing A GUI

 JavaScript is the most popular scripting language on


the internet.

› JavaScript was designed to add interactivity to HTML pages


› A scripting language is a lightweight programming language
› JavaScript is usually embedded directly into HTML pages

 You can learn the basic things about JavaScript here:


http://www.w3schools.com/js/
Developing A GUI

 For Detailed Information about JavaScript, please


go to
http://www.javascript.com/

 Link JavaScript functions to some input elements


in your GUI in order to handle the users’ input.

 Especially link JavaScript to the buttons or radi


o buttons.
Developing A GUI (An Exampl
e)
<html> Specify that this is an HTML document
<head> head part
<script language="javascript" type="text/javascript"> javascrip
t begin here
function Button1_onclick() {handle button1 click
if(document.myForm.username.value == "")
 get the value of username field
alert("UserName Can Not Be Null!")
javascript:myForm.submit() } submit the form
function Button2_onclick() {handle button2 click
window.open("RegisterPage.htm","_self"); }
</script> end of Javascript
</head> end of head
Developing A GUI (An Exampl
e)
<body> body part
<form name="myForm" action="login.jsp" method="post"> define a fo
rm (used to submit information of the input elements)
<input id="Text1" name="username" type="text" />
<input id="Password1" name="userpasswd" type="password" /> define
two input fields
<input id="Button1" type="button" value="Log In" onclick="return B
utton1_onclick()" />
<input id="Button2" type="button" value="Register" onclick="return
Button2_onclick()" />
define two buttons and their corresponding functions
</form> end of form
</body> end of body
</html> end of html
About JSP

 A technology for controlling the conten


t or appearance of Web pages through th
e use of small programs that are specif
ied in the Web page and run on the Web
server to modify the Web page.

 Java Server Pages (JSP) are normal HTML


with Java code pieces embedded in them
About JSP

 Recommended developing tools for JSP: Mi


crosoft Visual Studio 2005, UltraEdit, M
y Eclipse

 You can find everything you want about J


SP at:
http://java.sun.com/products/jsp/
http://www.jsptut.com/
About JSP (An Example)
<%
int a = 5; You can simply add the java
int b = 10; codes here between “<%” and
int c = a + b; “%>” to compute everything
%> you want
<html>
<body> HTML codes here
Hello, John. Your age is <%=c%>. Here is Your Personal
Information.
When you want to use the computing result of the Java Codes i
n HTML or JavaScript, you can simply use <% = variable name
%> to get its value, such as <%=c%>
</body> </html>
Connect to MySQL with JDBC

 First, please add these String Variables in y


our Java codes between “<%” and “%>” in J
SP
› String mysJDBCDriver = "com.mysql.jdbc.Driver";
› String mysURL = "jdbc:mysql://sbcstldb.translab.cs
.sunysb.edu:3306/username";
› String mysUserID = username;
› String mysPassword = password;
› username = your netID
› password = your SBU ID
Connect to MySQL with JDBC

Then add these codes after the definition of String va


riables (still between “<%” and “%>”):
› java.sql.Connection conn=null; // a new connection
› try
› {
› Class.forName(mysJDBCDriver).newInstance();
› java.util.Properties sysprops=System.getProperties();
› sysprops.put("user",mysUserID);
› sysprops.put("password",mysPassword);
› //the above is used to set property
› //connect to the database now
› conn=java.sql.DriverManager.getConnection(mysURL,sysprops);
Connect to MySQL with JDBC
System.out.println("Connected successfully to database using JConnec
t");
//add your SQL query and update sentences here
// try{
}
catch(Exception e)
{
e.printStackTrace();
out.print(e.toString());
}
finally{
try{conn.close();
catch(Exception ee) {};
}
Connect to MySQL with JDBC

 •An example of SQL Query, suppose we have a table Student (ID


, Age), where ID and Age are both String:
› // a new SQL Statement
› java.sql.Statement stmt1 = conn.createStatement();
› // a new Result Set
› java.sql.ResultSet rs = stmt1.executeQuery ("select * from Student wh
ere age = ‘” + c + “’”);
› String strID = new String();
› while(rs.next()) // now, rs records all the query //results from Stud
ent Table where Age is c
› {
› strID = rs.getString(“ID”);
› System.out.println(”Student ”+ strID +” ‟s age is ” + c + “!”);
}
THANKS SO MUCH!!!!! 

You might also like