TECHNOLOGIES
FORUMS
JOBS
BOOKS
EVENTS
INTERVIEWS
Live
MORE
LEARN
Training
CAREER
MEMBERS
VIDEOS
NEWS
BLOGS
Sign Up
Login
No unread comment.
View All Comments
No unread message.
View All Messages
No unread notification.
View All Notifications
C# Corner
Post
An Article
A Blog
A News
A Video
An EBook
An Interview Question
Ask Question
Struts 2 CRUD Operation Using JQuery
Amit Sanandiya
Jan 16, 2015
6
k
0
0
facebook
twitter
linkedIn
Reddit
WhatsApp
Email
Bookmark
This blog describe the simple example of Struts 2 CRUD operation Using JQuery with Oracle.
Introduction
This article is using for create example of struct 2 crud operation using JQuery and Oracle.
Background
We using Oracle for data storing in backgroud process.
Using the code
Please follow below steps for create struds 2 crud operation application.
First we create XML file
//
//
<?
xml
version
=
"1.0"
encoding
=
"UTF-8"
?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN" "http://struts.apache.org/dtds/struts-2.1.dtd"
>
<
struts
>
<
package
name
=
"default"
extends
=
"json-default"
>
<
action
name
=
"product"
class
=
"com.javatpoint.Product"
method
=
"execute"
>
<
result
name
=
"success"
>
welcome.jsp
</
result
>
</
action
>
<
action
name
=
"save"
class
=
"com.javatpoint.DatabaseConnection"
method
=
"save"
>
<
result
type
=
"json"
name
=
"success"
>
index.jsp
</
result
>
</
action
>
<
action
name
=
"update"
class
=
"com.javatpoint.DatabaseConnection"
method
=
"update"
>
<
result
type
=
"json"
name
=
"success"
>
index.jsp
</
result
>
</
action
>
<
action
name
=
"view"
class
=
"com.javatpoint.DatabaseConnection"
method
=
"view"
>
<!-- <interceptor-ref name="timer" /> -->
<
result
type
=
"json"
name
=
"success"
>
index.jsp
</
result
>
</
action
>
<
action
name
=
"delete"
class
=
"com.javatpoint.DatabaseConnection"
method
=
"delete"
>
<!-- <param name="time1">viewBookingDtls</param> -->
<
result
type
=
"json"
>
/index.jsp
</
result
>
</
action
>
</
package
>
</
struts
>
//
Second step for create action class.
import
java.sql.Connection;
import
java.sql.DriverManager;
import
java.sql.PreparedStatement;
import
java.sql.ResultSet;
import
java.util.ArrayList;
import
javax.servlet.http.HttpServletRequest;
import
org.apache.struts2.convention.annotation.Action;
import
com.Bean.UserDetails;
import
com.opensymphony.xwork2.ActionSupport;
import
org.apache.struts2.convention.annotation.Result;
import
org.apache.struts2.interceptor.ServletRequestAware;
public
class
DatabaseConnection
extends
ActionSupport {
private
static
final
long
serialVersionUID = 1L;
ArrayList<UserDetails> list=
new
ArrayList<UserDetails>();
//private javax.servlet.http.HttpServletRequest request;
Connection con =
null
;
private
String mess=
null
;
public
DatabaseConnection(){
con =
new
GetConnectionClass().getConnection();
}
/*Here array list will directly accessible into jsp page*/
//@Action(value="view",results={@Result(name="success",location="index.jsp")})
public
String view(){
try
{
PreparedStatement ps=con.prepareStatement(
"select * from ifsapp.user_roles where rownum<50"
);
ResultSet rs=ps.executeQuery();
while
(rs.next()){
UserDetails user=
new
UserDetails();
user.setUserID(rs.getString(
"USERID"
));
user.setUserName(rs.getString(
"NAME"
));
user.setLocation(rs.getString(
"LOCATION"
));
list.add(user);
}
con.close();
}
catch
(Exception e){e.printStackTrace();}
return
"success"
;
}
/*Here you can insert data into the database*/
public
String save(){
mess =
"successfully Save"
;
return
"success"
;
}
/*Here you can Update data into the database*/
public
String update(){
System.out.println(
"update"
);
mess =
"successfully Update"
;
return
"success"
;
}
/*Here you can delete data into the database*/
@Action
(value=
"delete"
,results={
@Result
(name=
"success"
,location=
"index.jsp"
)})
public
String delete(){
//System.out.println(request.getParameter("time"));
System.out.println(
"delete"
);
mess =
"successfully deleted"
;
return
"success"
;
}
public
String getMess() {
return
mess;
}
public
void
setMess(String mess) {
this
.mess = mess;
}
public
ArrayList<UserDetails> getList() {
return
list;
}
public
void
setList(ArrayList<UserDetails> list) {
this
.list = list;
}
/*@Override
public void setServletRequest(HttpServletRequest request) {
this.request = request;
}*/
}
Now We create JSP Files
<%@ taglib uri=
"/struts-tags"
prefix=
"s"
%>
<%@ page language=
"java"
contentType=
"text/html; charset=ISO-8859-1"
pageEncoding=
"ISO-8859-1"
%>
<link rel=
"stylesheet"
type=
"text/css"
href=
"css/jquery-ui.custom.css"
/>
<link href=
"css/Style.css"
rel=
"stylesheet"
type=
"text/css"
/>
<link rel=
"stylesheet"
type=
"text/css"
href=
"css/ui.jqgrid.css"
/>
<script type=
'text/javascript'
src=
"js/jquery-1.7.2.min.js"
></script>
<script type=
'text/javascript'
src=
"js/grid.locale-en.js"
></script>
<script type=
"text/javascript"
>
$.jgrid.no_legacy_api =
true
;
$.jgrid.useJSON =
true
;
</script>
<script type=
'text/javascript'
src=
"js/jquery-ui-1.8.14.custom.js"
></script>
<script type=
'text/javascript'
src=
"js/jquery.jqGrid.min.js"
></script>
<script type=
'text/javascript'
src=
"js/CRUD.js"
></script>
<script type=
"text/javascript"
>
$(document).ready(
function
() {
view();
});
</script>
<div style=
"float: left;"
align=
"center"
>
<div id=
"userDetailsDiv"
></div>
<table id=
"userDetailsTable"
></table>
</div>
<script type=
"text/javascript"
>
jQuery(
"#userDetailsTable"
).jqGrid(
{
datatype :
"local"
,
colNames : [
'UserID'
,
'Name'
,
'Location'
],
colModel : [
{name :
'userID'
,index :
'userID'
,width : 150},
{name :
'userName'
,index :
'userName'
,width : 300},
{name :
'location'
,index :
'location'
,width : 150}
],
rowNum : 30,
rowList : [ 10, 20, 30 ],
pager : jQuery(
'#userDetailsDiv'
),
sortname :
'id'
,
viewrecords :
true
,
sortorder :
"asc"
,
caption :
"User Details "
,
width : 750,
multiselect:
true
,
shrinkToFit :
false
,
height : 260,
});
jQuery(
"#userDetailsTable"
).jqGrid(
'navGrid'
,
'#userDetailsDiv'
,{edit:
false
, add:
false
, del:
false
, search:
false
,refresh:
false
},{ }, { }, { }, { } );
jQuery(
"#userDetailsTable"
).jqGrid(
'navButtonAdd'
,
'#userDetailsDiv'
, {
caption :
"ADD"
,
buttonicon :
"ui-icon-plus"
,
title :
"Add Row"
,
onClickButton :
function
() {
saveUser();
}
});
jQuery(
"#userDetailsTable"
).jqGrid(
'navButtonAdd'
,
'#userDetailsDiv'
, {
caption :
"Delete"
,
buttonicon :
"ui-icon-trash"
,
title :
"Delete Row"
,
onClickButton :
function
() {
deleteUser();
}
});
jQuery(
"#userDetailsTable"
).jqGrid(
'navButtonAdd'
,
'#userDetailsDiv'
, {
caption :
"Update"
,
buttonicon :
""
,
title :
"Update Row"
,
onClickButton :
function
() {
updateUser();
}
});
</script>
History
Keep a running update of any changes or improvements you've made here.
Struts 2 Crud operation Using JQuery
Next Recommended Reading
Swap two numbers without using third variable in java