Pages Navigation Menu

Coding is much easier than you think

Setting up jQuery jTable plugin in Struts 2 framework

 
In this article we will learn to setup jTable and dependent libraries in Struts 2 web application. jTable is a jQuery plugin which is used to create AJAX based CRUD tables without coding HTML or Javascript, to know more about jTable please refer the article here
 

Steps done to set up our application for jTable

 
Libraries required for the setup,

 
Now to start with demonstration of above topic, let us Create a Dynamic Web Project in Eclipse, with following project structure.
 
jTable in struts 2
 
As show in the image download the required library mentioned and place it in js and css folder of eclipse work-space, and refer these files in the head section in the jsp as shown below.
 
Setup done from the browser perspective: jTable
 
jTable plugin allows you to issue an ajax request via jQuery plugin and expects a JSON object as a response, hence the following configuration needs to be made in Jsp file
 

Jsp Page

 
File : jTable.jsp

<html>
<head>
<title>jTable in Struts 2</title>
<!-- jTable Metro theme -->
<link href="css/metro/blue/jtable.css" rel="stylesheet" type="text/css" />
<link href="css/jquery-ui-1.10.3.custom.css" rel="stylesheet"
	type="text/css" />

<!-- jTable script file. -->
<script src="js/jquery-1.8.2.js" type="text/javascript"></script>
<script src="js/jquery-ui-1.10.3.custom.js" type="text/javascript"></script>
<script src="js/jquery.jtable.js" type="text/javascript"></script>
<script type="text/javascript">
	$(document).ready(function() {
		$('#StudentTableContainer').jtable({
			title : 'Students List',
			actions : {
				listAction : 'listAction'
			},
			fields : {
				studentId : {
					title : 'Student Id',
					width : '30%',
					key : true,
					list : true,
					create : true
				},
				name : {
					title : 'Name',
					width : '30%',
					edit : false
				},
				department : {
					title : 'Department',
					width : '30%',
					edit : true
				},
				emailId : {
					title : 'Email',
					width : '20%',
					edit : true
				}
			}
		});
		$('#StudentTableContainer').jtable('load');
	});
</script>

</head>
<body>
<div>
	<h3>Integrating jTable jQuery plugin and Struts 2 framework</h3>
	    <div id="StudentTableContainer"></div>
</div>
</body>
</html>

 
As you can see, jTable just needs a div container as the only HTML tag. It fields options are explained below:
title: Title of the table.
actions: URLs of actions that are used to create/delete/update/list records.
fields: It defines the field names that represent columns of the record. Note that the field name should exactly match the instance variable defined in the model class.
 
Setup done from the server’s perspective: Struts 2 Action class
 
In the Action class, we are populating a list of type “Student”(Model). Since jTable accepts data only in Json format, so we are converting this List (Java Object) to Json(Javascript object Notation) format using struts2-json-plugin.jar.

**Update:: In the article AJAX implementation in Struts 2 using JQuery and JSON I have explained about usage of struts2-json-plugin.jar clearly, So if you are not aware of how struts2-json-plugin works, then please go thorough the above mentiioned link.

 

Action Class

 

package com.simplecodestuffs.action;

import java.util.ArrayList;
import java.util.List;

import com.opensymphony.xwork2.Action;
import com.simplecodestuffs.model.Student;

public class JtableAction {

	private List<Student> records = new ArrayList<Student>();
	private String result;

	public String list() {
		// Add data to Student list
		records.add(new Student(1, "Haripriya", "IT", "xyz@xyz.com"));
		records.add(new Student(2, "Dinesh", "ECE", "xyz@gmail.com"));
		records.add(new Student(3, "Prabhu", "MECH", "abc@gmail.com"));
		records.add(new Student(4, "Badru", "ECE", "efg@gmail.com"));
		records.add(new Student(5, "Lahir nisha", "CSC", "xyz@gmail.com"));
		records.add(new Student(6, "Nilafar nisha", "CSC", "123@gmail.com"));
		records.add(new Student(7, "Jamil", "ECE", "789@gmail.com"));
		records.add(new Student(8, "Mahes", "ECE", "123@gmail.com"));
		records.add(new Student(9, "Lourde", "IT", "xyz@gmail.com"));
		result = "OK";

		return Action.SUCCESS;
	}

	public List<Student> getRecords() {
		return records;
	}

	public void setRecords(List<Student> records) {
		this.records = records;
	}

	public String getResult() {
		return result;
	}

	public void setResult(String result) {
		this.result = result;
	}
}

 
In case of read operations in jTable, Result property must be “OK” if operation is successful. If an error occurs, then Result property must be “ERROR”. If Result is “OK”, the Records property will contain an array of records defined in the action class. If it’s ERROR, a Message property will contain an error message to show to the user. A sample return value for listAction is show below
 

{
"Result":"OK",
"Records":
[{
"studentId":1,
"name":"Haripriya",
"department":"IT",
"emailId":"xyz@xyz.com"
}]
}

 

Model Class

 
Create the Model class which will have getters and setters for fields specified in jTable script.
 

package com.simplecodestuffs.model;

public class Student {

	public Student() {
	}

	public Student(int studentId, String name, String department, String emailId) {
		super();
		this.studentId = studentId;
		this.name = name;
		this.department = department;
		this.emailId = emailId;
	}

	private int studentId;
	private String name;
	private String department;
	private String emailId;

	public int getStudentId() {
		return studentId;
	}

	public String getName() {
		return name;
	}

	public String getDepartment() {
		return department;
	}

	public String getEmailId() {
		return emailId;
	}

	public void setStudentId(int studentId) {
		this.studentId = studentId;
	}

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

	public void setDepartment(String department) {
		this.department = department;
	}

	public void setEmailId(String emailId) {
		this.emailId = emailId;
	}
}

 

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>
<package name="default" extends="json-default">
   <action name="listAction" class="com.simplecodestuffs.action.JtableAction"
	method="list">
	<result type="json">/jTable.jsp</result>
  </action>
  <action name="getJSONResult" class="com.simplecodestuffs.action.JtableAction" method="list">
	<result type="json" />
  </action>
</package>
</struts>

Since jTable accepts data only in Json format, So in order to convert java object to json object I have extended json-default package instead of struts-default package, please refer article here for more detail on json-default package.
 

Demo

 
On running the application i got the following response
 
Jtable exception
 
Since I have not handled any exception, so the message displayed in error box is empty.
 
While debugging the error I found that the json response formed in struts application as below.
get json result in Jtable
 
Hear the property names of jTable plugin are case sensitive. Only “Result”, “Records” and “Message” will work. In struts 2 the “json response” generated is in lower case[“result”, “records” and “message”], hence I edited the jtable.js to replace Result to result, Records to records and Message to message then it worked.
 
**Note: Along with the above keyword replace TotalRecordCount to totalRecordCount respectively, since this parameter will be used to display pagination count(Which I will implement in upcoming tutorial)
 
jquery-jtable-in-struts-2
 
Now on including action for create, update and delete in jsp page as below

actions : {
	listAction : 'list',
	createAction : 'create',
	updateAction : 'update',
	deleteAction : 'delete'
}

 
On running the application
Integrating-jQuery-jTable-plugin-with-Struts2-framework
 
On clicking ‘Add new record’
Struts-2-using-jTable-jQuery-plug-in-Create-record
 
On clicking edit button
Struts-2-jTable-jQuery-plug-in-Update-record
 
On clicking delete button
Struts-2-jTable-jQuery-plug-in-Delete-record
 
Note :
 
In the above program I have not included the logic for create, delete and update functions. In the article CRUD Operations in Struts 2 using jTable jQuery plugin via Ajax I have implemented CRUD operation using jTable jQuery plugin in Struts 2, and in the article Pagination in Struts 2 using jQuery jTable plugin I have implemented paging feature using the same plugin.
 
download
 

Reference

 
jTable official website
AJAX based CRUD tables using ASP.NET MVC 3 and jTable jQuery plug-in
 

About Mohaideen Jamil


Am currently working as a Struts 2 Developer in a reputed IT Organisations. I can help you with teaching Core java and Struts 2. Follow me on Facebook or Google Plus. If you like my tutorials, consider making a donation to this charity, thanks.

  • Shohruh Sharipov

    Hi Jamil,

    I am doing a project using struts2, hibernate and spring. So I have to use ajax based jquery jtable in my project to display data from the postgresql 9.3 database.

    First of all, I just created java class named UserList:

    import java.io.Serializable;

    public class UserList implements Serializable {

    private String firstname;
    private String lastname;
    private String department_name;
    private String company_name;
    private String gps_type;

    public String getGps_type() {
    return gps_type;
    }

    public void setGps_type(String gps_type) {
    this.gps_type = gps_type;
    }

    public String getFirstname() {
    return firstname;
    }

    public void setFirstname(String firstname) {
    this.firstname = firstname;
    }

    public String getLastname() {
    return lastname;
    }

    public void setLastname(String lastname) {
    this.lastname = lastname;
    }

    public String getDepartment_name() {
    return department_name;
    }

    public void setDepartment_name(String department_name) {
    this.department_name = department_name;
    }

    public String getCompany_name() {
    return company_name;
    }

    public void setCompany_name(String company_name) {
    this.company_name = company_name;
    }
    }
    And after this, I just created dao class:

    public List getUsersList() {
    try {

    Query query = getSession().createSQLQuery(“SELECT users.firstname as firstname,users.lastname as lastname,departments.name as department,companies.name as companies,gpstype.name as gps_type FROM users,departments,companies,gpstype,gpsdevice WHERE person_department_id=departments.id AND departments.companies_id=companies.id AND gpsdevice.type_id=gpstype.id”);

    List usersList = new ArrayList();
    Object usersObj = query.list();
    ArrayList userStr = (ArrayList) usersObj;
    for (Object users : userStr) {
    Object[] objs = (Object[]) users;
    GpsUserList gpsUserList = new GpsUserList();
    gpsUserList.setFirstname(objs[0].toString());
    gpsUserList.setLastname(objs[1].toString());
    gpsUserList.setDepartment_name(objs[2].toString());
    gpsUserList.setCompany_name(objs[3].toString());
    gpsUserList.setGps_type(objs[4].toString());
    usersList.add(gpsUserList);
    }
    return usersList;
    } catch (Exception e) {
    return null;
    }
    }
    Here is the my struts.xml file:

    /WEB_INF/part_page/user_action.jsp

    record

    And here is the my jsp file:

    $(document).ready(function () {
    $(‘#StudentTableContainer’).jtable({
    paging: true,
    sorting: true,
    title: ‘Users List’,
    pageSize: 10,
    toolbar: {
    items: [{
    icon: ‘/img/excel.png’,
    text: ‘Export to Excel’,
    click: function () {

    }
    }]
    },
    actions: {
    listAction: ‘listAction.htm’,
    createAction: ‘createAction’,
    deleteAction: ‘deleteAction’,
    updateAction: ‘updateAction’
    },
    fields: {
    firstname: {
    title: ‘Firstname’,
    width: ‘15%’,
    key: true,
    list: true,
    create: true
    },
    lastname: {
    title: ‘Lastname’,
    width: ‘15%’,
    key: true,
    list: true,
    create: true
    },
    department_name: {
    title: ‘Department’,
    width: ‘15%’,
    edit: true
    },
    company_name: {
    title: ‘Company’,
    width: ‘15%’,
    edit: true
    },
    gps_type: {
    title: ‘Gps type’,
    width: ‘10%’,
    edit: true
    }
    }
    });
    $(‘#StudentTableContainer’).jtable(‘load’);
    });

    I did all this things correctly when I run the project, it is just loading from database but it does not show on jtable.

  • shoxrux sharipov

    Hello, guys!!! I need your help, it is very urgent!!!

    I am doing a web application using struts2, hibernate and spring. So I have to use ajax based jquery jtable in my project to display data from the postgresql 9.3 database.

    First of all, I just created java class named UserList:

    import java.io.Serializable;

    public class UserList implements Serializable {

    private String firstname;

    private String lastname;

    private String department_name;

    private String company_name;

    private String gps_type;

    public String getGps_type() {

    return gps_type;

    }

    public void setGps_type(String gps_type) {

    this.gps_type = gps_type;

    }

    public String getFirstname() {

    return firstname;

    }

    public void setFirstname(String firstname) {

    this.firstname = firstname;

    }

    public String getLastname() {

    return lastname;

    }

    public void setLastname(String lastname) {

    this.lastname = lastname;

    }

    public String getDepartment_name() {

    return department_name;

    }

    public void setDepartment_name(String department_name) {

    this.department_name = department_name;

    }

    public String getCompany_name() {

    return company_name;

    }

    public void setCompany_name(String company_name) {

    this.company_name = company_name;

    }

    }

    And after this, I just created dao class:

    public List getUsersList() {

    try {

    Query query = getSession().createSQLQuery(“SELECT users.firstname as firstname,users.lastname as lastname,departments.name as department,companies.name as companies,gpstype.name as gps_type FROM users,departments,companies,gpstype,gpsdevice WHERE person_department_id=departments.id AND departments.companies_id=companies.id AND gpsdevice.type_id=gpstype.id”);

    List usersList = new ArrayList();

    Object usersObj = query.list();

    ArrayList userStr = (ArrayList) usersObj;

    for (Object users : userStr) {

    Object[] objs = (Object[]) users;

    GpsUserList gpsUserList = new GpsUserList();

    gpsUserList.setFirstname(objs[0].toString());

    gpsUserList.setLastname(objs[1].toString());

    gpsUserList.setDepartment_name(objs[2].toString());

    gpsUserList.setCompany_name(objs[3].toString());

    gpsUserList.setGps_type(objs[4].toString());

    usersList.add(gpsUserList);

    }

    return usersList;

    } catch (Exception e) {

    return null;

    }

    }

    Here is the my struts.xml file:

    /WEB_INF/part_page/user_action.jsp

    record

    And here is the my jsp file:

    <%—-%>

    $(document).ready(function () {

    $(‘#StudentTableContainer’).jtable({

    paging: true,

    sorting: true,

    title: ‘Users List’,

    pageSize: 10,

    toolbar: {

    items: [{

    icon: ‘/img/excel.png’,

    text: ‘Export to Excel’,

    click: function () {

    }

    }]

    },

    actions: {

    listAction: ‘listAction.htm’,

    createAction: ‘createAction’,

    deleteAction: ‘deleteAction’,

    updateAction: ‘updateAction’

    },

    fields: {

    firstname: {

    title: ‘Firstname’,

    width: ‘15%’,

    create: true

    },

    lastname: {

    title: ‘Lastname’,

    width: ‘15%’,

    edit: true

    },

    department_name: {

    title: ‘Department’,

    width: ‘15%’,

    edit: true

    },

    company_name: {

    title: ‘Company’,

    width: ‘15%’,

    edit: true

    },

    gps_type: {

    title: ‘Gps type’,

    width: ‘10%’,

    edit: true

    }

    }

    });

    $(‘#StudentTableContainer’).jtable(‘load’);

    });

    I did all this things correctly when I run the project, it is just loading from database but it does not show on jtable.

    Thanks in advance!

  • Sunaina Khanna

    java.lang.ClassNotFoundException: ognl.PropertyAccessor..I am getting this error when im running the above code.The web page displays 404 not found…pls help!!

  • Edward

    Hello can this be done using Struts 3.2

    • http://www.simplecodestuffs.com/ Mohaideen Jamil

      There is no such thing called struts 3.2. Latest version is Struts 2.3.24

      • Edward

        Sorry I meant Struts 1. To answer my question I know it can. However if you can please spare some time to answer another question would be appropriated. I am using JTable plugin with JSP and Struts. Basically, this is what I trying to do:

        The table must have two columns, Model and ModelYear.
        When I click “Add new record” in the popup input page there must be a dropdown list for Model and dropdown list for ModelYear.

        The Model Year dropdown is cascading meaning that when user selects Model from Model dropdown an Ajax call is made to the server and the Model Years for that Selected Model are send back via JSON and its displayed in ModelYear dropdown (Basic Cascade).

        Right now my goal is to see the two dropdowns so I can add a new record.

        The problem is, when I click the “Add new record” button the Input Popup page does not have my dropdown lists, it appears to only have the Model and Modelyear fields from the Table.

        Here is my JTable code:

        $(document).ready(function() {
        $(‘#ModelMYContainer’).jtable({
        title : ‘ModelMY Table’,
        actions : {
        listAction : ‘listITModelMY.do’,
        createAction : ‘createAction’,
        updateAction : ‘updateAction’,
        deleteAction : ‘deleteAction’
        },

        fields : {
        model : {
        title : ‘Model’,
        options: ‘getModelList.do’,
        list: false
        },
        modelyear: {
        title: ‘Model Year’,
        dependsOn: ‘model’,
        options: function (data) {
        if (data.source == ‘list’) {
        return ‘getModelYearList.do';
        }

        return ‘getModelYearList.do=’ + data.dependedValues.ModelId;
        },
        list: false
        },
        model : {
        title : ‘Model’,
        width : ‘10%’,
        edit : true
        },
        modelyear : {
        title : ‘Model Year’,
        width : ‘10%’,
        edit : true
        }
        }
        });
        $(‘#ModelMYContainer’).jtable(‘load’);
        });

        • http://www.simplecodestuffs.com/ Mohaideen Jamil

          The problem is you are using same name for different fields. In this case you have used the model and modelYear twice. Just rename the field name and title of modal and modalYear of dropdown list to any valid variable. Then your program will work.

        • Edward

          Thankyou. I am having a problem now with the update action in JTable Plugin. Wondering if you please shed some light on it. Would appreciate very much. When I edit a record I get the Model and Model Year dropdowns in the edit pop-up. They are being successfully populated via AJax calls. The problem is when I save my Model and Model Year choices the record changes are not reflecting on the row that I am editing. On the server side (struts Java) I am sending back the edited row based on what was picked in the dropdowns. The JSON response is in the exact format required, identical to what is expected during update action.

          Is there anyway to make JTable replace the edited row with the values returned in the JSON object or with the values I pick from the dropdowns. Here is my client side code:

          $(document).ready(function() {
          $(‘#ModelMYContainer’).jtable({
          title : ‘ModelMY Table’,
          actions : {
          listAction : ‘itsModelMYTable.do?action=list’,
          createAction : ‘itsModelMYTable.do?action=create’,
          updateAction : ‘itsModelMYTable.do?action=edit’,
          deleteAction : ‘deleteAction’
          },
          fields : {
          model_create : {
          title : ‘Model’,
          options: ‘getModelList.do’,
          create: true,
          edit: true,
          list: false
          },
          modelyear_create: {
          title: ‘Model Year’,
          dependsOn: ‘model_create’,
          options: function (data) {
          return ‘getITSModelYearList.do?model=’ + data.dependedValues.model_create;
          },
          create: true,
          edit: true,
          list: false
          },
          model : {
          title : ‘Model’,
          width : ‘10%’,
          create: false,
          edit: false,
          list: true
          },
          modelyear : {
          title : ‘Model Year’,
          width : ‘10%’,
          create: false,
          edit: false,
          list: true
          }
          }

          });
          $(‘#ModelMYContainer’).jtable(‘load’);

          });

  • ali amiri

    I have done exactly like your tutorial but when I go to the page it shows Json, not table, Also I do your tutorial is Json and struts and that works like a charm but I’m working on this for two days and I didnt get any result what is wrong that I see json message instead of table?

    • http://www.simplecodestuffs.com/ Mohaideen Jamil

      Hi, You have to redirect the json response to the same jsp from which you made the ajax call.

      example:- /jTable.jsp

      Please download the example file and execute it

      • ali amiri

        Thanks Jamil for your quick response, I downloaded that and fix my problem, yesterday :)

  • Rohan P.

    Do we have to replace those 4 keywords in all .js files? Thank you.

    • http://www.simplecodestuffs.com Mohaideen Jamil

      In jtable.Jquery.js or jtable.Jquery.min.js file

  • Deepak Sinha

    Setting up jQuery jTable plugin in Struts 2 framework..
    Error
    everything is ok….
    when create,edit,delete(we are giving the some msg).
    An error occured while communicating to the server
    msg display to error box(plzzzzz help me)

  • abhi

    hii sir i ref ur article, as u mention i change Result to result, Records to records and Message to message in jquery.jtable.js. my action class is like below:

    public class ReadOutwardAction extends ActionSupport
    {

    private List records=new ArrayList();
    private String result;
    public List getRecords() {
    return records;
    }

    public void setRecords(List records) {
    this.records = records;
    }

    public String getResult() {
    return result;
    }

    public void setResult(String result) {
    this.result = result;
    }

    public String list() {
    records.add(new ChequeInfoModel(111111,111111111,”aaaaaa”));
    records.add(new ChequeInfoModel(222222,222222222,”bbbbbb”));
    records.add(new ChequeInfoModel(333333,333333333,”cccccc”));
    records.add(new ChequeInfoModel(444444,444444444,”dddddd”));
    records.add(new ChequeInfoModel(555555,555555555,”eeeeee”));
    records.add(new ChequeInfoModel(666666,666666666,”ffffff”));
    records.add(new ChequeInfoModel(777777,777777777,”gggggg”));
    result=”OK”;

    return Action.SUCCESS;
    }
    }//end ReadOutwardAction

    – i also try jquery.jtable.js of your demo example but still i get response like below:
    {“records”:[{“clo_chequeNo”:111111,”clo_payeeName”:”aaaaaa”,”clo_sortCode”:111111111},{“clo_chequeNo”:222222,”clo_payeeName”:”bbbbbb”,”clo_sortCode”:222222222},{“clo_chequeNo”:333333,”clo_payeeName”:”cccccc”,”clo_sortCode”:333333333},{“clo_chequeNo”:444444,”clo_payeeName”:”dddddd”,”clo_sortCode”:444444444},{“clo_chequeNo”:555555,”clo_payeeName”:”eeeeee”,”clo_sortCode”:555555555},{“clo_chequeNo”:666666,”clo_payeeName”:”ffffff”,”clo_sortCode”:666666666},{“clo_chequeNo”:777777,”clo_payeeName”:”gggggg”,”clo_sortCode”:777777777}],”result”:”OK”}

    plz, help me it’s urgent

  • karuna

    how to do same application using in spring mvc hibernate and ajax with jquery json response

  • karuna

    hi jamil..
    how to develop crud operations using spring MVC hibernate using jtable -jquery -plugin via ajax and json response

  • ram

    {“app”:1,”message”:null,”record”:null,”records”:[{“do”:”Indi”,”do”:1,”don”:”asdasd”}],”result”:”OK”}
    i got this problem pls help me as soon as possiable

    • http://www.simplecodestuffs.com Mohaideen Jamil

      Possible fixes…
      1. The property names of jTable plugin are case sensitive. Only “Result”, “Records” and “Message” will work. In struts 2 the “json response” generated is in lower case[“result”, “records” and “message”], hence you need to edit jquery.jtable.js to replace Result to result, Records to records and Message to message.

      2. Check weather you created getter and setter for “result”, “records” and “message” in your action class.

      • ram

        Hai jamil thanks to reply

        i diid ‘n get that result,records,messsage where is that changes..pls tell me where i am changing in jquery.jtable.js

        pls help me this is urgent for project.pls as sooon as posiiable

        Thanks

        • NansJames

          I cannot change the result,records and messages in jtable.js. after i can i cannot save the file. its showing error like “ISO character”

  • ramu

    Hai jamil,

    how to write dropdownlist pls help me

  • sanju

    how to add json and server side validations using struts2 frame work pls help me as soon as possiable

  • vipinsharma

    Hi Mr Jamil
    How i can use a action in struts 2 , which is responsible to generate a json data to populate a option field value to create combo box

    • http://www.simplecodestuffs.com Mohaideen Jamil

      I will write an article about it in my leasure time, mean while you can refer this link http://www.codeproject.com/Articles/277576/AJAX-based-CRUD-tables-using-ASP-NET-MVC-and-jTa

      • vipinsharma

        I am able to create action that will responsible to generate and populate field options value in gson format but while editing record , related field combo-box shows ‘undefined’ displaytext instead of.

        url : http://nic3-pc:8080/VisaNote/getCountry

        sample data as

        {“options”:[{“countryid”:”2″,”countryname”:”Germany”},{“countryid”:”6″,”countryname”:”Japan”},{“countryid”:”5″,”countryname”:”Malaysia”},{“countryid”:”3″,”countryname”:”UK”},{“countryid”:”1″,”countryname”:”USA”},{“countryid”:”4″,”countryname”:”australia”}],”result”:”OK”}

        In jsp Page
        The field definition as

        country : {
        title : ‘Country’,
        width : ‘30%’,
        edit : true,
        options :’getCountry’ // action name
        }

        During editing this field combo box showing undefined value …

        Pl help , what should i do ..

        • http://gravatar.com/jamilrehman Mohaideen Jamil

          Have you replaced Options to options in jquery.jTable.js file ??

        • vipinsharma

          Yes I have change Options to options ….

  • ramu

    how to implement validations pls help

  • ramu

    where is jTable.jsp pls help me

    • http://www.simplecodestuffs.com Mohaideen Jamil

      Hiits, jquery.jtable.js file

      • ramu

        very very thanks…………….

  • hirak

    I couldn’t able to find jtable.js file. pls help

    • http://www.simplecodestuffs.com Mohaideen Jamil

      its jquery.jtable.js

  • hicham

    hello Mr Jamil,
    first i would like to thank you for your really hard work and your good tutorials.

    the listing worked greatly , but to add a record i found some problems. as it does add the record in the database , but the table in jsp does not refresh and add the record.

    My code :
    // .. getter and setter for record , records , and result

    public String ajouter() {
    records = new ArrayList() ;
    record = new Bean() ;

    //Bean set properties..

    BeanDao = new BeanDao ();
    BeanDao .addBean(record );

    result=”OK”;
    records.add(record);

    return SUCCESS;
    }
    i added an action in struts.xml and called it from the javascript function in jsp.

    result of the action when called in url :

    {“id”:null,”record”:{“classe”:”blaaclass”,”date”:”2014-06-12T01:13:24″,”id”:386,”idProjet”:89,”idtest”:9,”namemethode”:”namemeth”,”sloc”:23,”slocInt”:3.0,”type”:”static “,”vg”:12.0,”vgInt”:3.0},”records”:[{“classe”:”blaaclass”,”date”:”2014-06-12T01:13:24″,”id”:386,”idProjet”:89,”idtest”:9,”namemethode”:”namemeth”,”sloc”:23,”slocInt”:3.0,”type”:”static “,”vg”:12.0,”vgInt”:3.0}],”result”:”OK”}

    i tried to solve it but in vain , i would really appreciate your help since am late for a project.
    thank you once again.

  • hicham

    hello Mr Jamil,
    first i would like to thank you for your really hard work and your good tutorials.

    the listing worked greatly , but to add a record i found some problems. as it does add the record in the database , but the table in jsp does not refresh and add the record.

    My code :
    // .. getter and setter for record , records , and result

    public String ajouter() {
    records = new ArrayList() ;
    record = new Bean() ;

    //Bean set properties..

    BeanDao = new BeanDao ();
    BeanDao .addBean(record );

    result=”OK”;
    records.add(record);

    return SUCCESS;
    }
    i added an action in struts.xml and called it from the javascript function in jsp.

    result of the action when called in url :

    {“id”:null,”record”:{“classe”:”blaaclass”,”date”:”2014-06-12T01:13:24″,”id”:386,”idProjet”:89,”idtest”:9,”namemethode”:”namemeth”,”sloc”:23,”slocInt”:3.0,”type”:”static “,”vg”:12.0,”vgInt”:3.0},”records”:[{“classe”:”blaaclass”,”date”:”2014-06-12T01:13:24″,”id”:386,”idProjet”:89,”idtest”:9,”namemethode”:”namemeth”,”sloc”:23,”slocInt”:3.0,”type”:”static “,”vg”:12.0,”vgInt”:3.0}],”result”:”OK”}

    i tried to solve it but in vain , i would really appreciate your help since am late for a project.
    thank you once again.

    • http://www.simplecodestuffs.com Mohaideen Jamil

      Hi Hicham,

      Thanks for your feedback, and regarding the issue, Have you replaced Result to result, Records to records and Message to message in jtable.js file? If not modify it since the property names of jTable plugin are case sensitive. I have written an article on CRUD Operations in Struts 2 using jTable jQuery plugin via Ajax – http://www.simplecodestuffs.com/crud-operations-in-struts-2-using-jtable-jquery-plugin-via-ajax/ , Please refer this link, I hope it helps, let me know if you face any issue.

      • Hicham

        thank you for your response and indeed , i solved it by changing first letter to lower case .

        • http://www.simplecodestuffs.com Mohaideen Jamil

          Most welcome :)