empire on jqGrid with JSP

Thu, 25 Aug 2011 22:35:46 +0300

I was able to resolve this exception(it was because JSON object was not building in proper format). but now I can not display the grid.

I also changed the grid model in java script according to database values now I have no error but everything is blank as we have not given in html where to pring the grid.

anybody ?

Empire

empire on jqGrid with JSP

Thu, 25 Aug 2011 21:04:08 +0300

Hi Nobel I also tried the same example and got the same exception "Error 500: java.lang.NumberFormatException: null".

Did you find the solution for this exception ?

Bryce were you able to run this ?

Thank you

Empire

brycekmartin on jqGrid with JSP

Wed, 02 Mar 2011 18:30:11 +0200

Hey Nobel,

Do you still need help on this??

I have used jqGrid with JSP. What exactly are the errors you are getting? Are they JS or Java based? Are you using Servlets and Beans for data passing?

Thanks
Bryce

nobel on jqGrid with JSP

Tue, 25 Jan 2011 06:17:10 +0200

Hi,

I have refered the site: http://trirand.com/blog/jqgrid.....qgrid.html. I want to build a Grid for my project officially. Here, They have given sample sources along with the *.php in order to bring db data. I am trying to use *.jsp instead of *.php.

I have tried to build a jqGrid along with jsp. But, i come across Number Format Exception. I submit my code as follows:

1. index.jsp:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!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>Sample JQuery Grid</title>

<link rel="stylesheet" type="text/css" media="screen" href="themes/basic/grid.css" />

<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>

<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>

</head>
<body>
   <table id="list5" class="scroll" cellpadding="0" cellspacing="0"></table>
   <div id="pager5" class="scroll" style="text-align:center;"></div>
   <table id="list5" class="scroll" cellpadding="0" cellspacing="0"></table>
   <div id="pager5" class="scroll" style="text-align:center;"></div>
   <br />

   <a href="#" id="a1">Get data from selected row</a>
   <br />

   <a href="#" id="a2">Delete row 2</a>
   <br />

   <a href="#" id="a3">Update amounts in row 1</a>
   <br />

   <a href="#" id="a4">Add row with id 99</a>

   <script src="manipex.js" type="text/javascript"> </script>
   <br />
</body>
</html>

2. manipex.js:

jQuery("#list5").jqGrid({
    url:'griddata.jsp',
   datatype: "json",
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
    colModel:[
        {name:'id',index:'id', width:55},
        {name:'invdate',index:'invdate', width:90},
        {name:'name',index:'name', width:100},
        {name:'amount',index:'amount', width:80, align:"right"},
        {name:'tax',index:'tax', width:80, align:"right"},
        {name:'total',index:'total', width:80,align:"right"},
        {name:'note',index:'note', width:150, sortable:false}
    ],
    rowNum:10,
    rowList:[4,8,12],
    imgpath: "themes/basic/images",
    pager: jQuery('#pager5'),
    sortname: 'id',
    viewrecords: true,
    sortorder: "desc",
    caption:"Invoice Data"
}).navGrid("#pager5",{edit:false,add:false,del:false});

jQuery("#a1").click( function(){
   var id = jQuery("#list5").getGridParam('selrow');
   if (id)   {
       var ret = jQuery("#list5").getRowData(id);
       alert("id="+ret.id+" invdate="+ret.invdate+"...");
   } else { alert("Please select row");}
});

jQuery("#a2").click( function(){
var su=jQuery("#list5").delRowData(12);
if(su) alert("Succes. Write custom code to delete row from server"); else alert("Allready deleted or not in list");
});

jQuery("#a3").click( function(){
var su=jQuery("#list5").setRowData(11,{amount:"333.00",tax:"33.00",total:"366.00",note:"<img src='images/user1.gif'/>"});
if(su) alert("Succes. Write custom code to update row in server"); else alert("Can not update");
});

jQuery("#a4").click( function(){
   var datarow = {id:"99",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"};
   var su=jQuery("#list5").addRowData(99,datarow);
   if(su) alert("Succes. Write custom code to add data in server"); else alert("Can not update");
});

3. griddata.jsp:

<%@ page import="java.sql.*,java.util.ArrayList" language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@page import="net.sf.json.JSONObject"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Invoice Grid</title>
</head>
<body>
   <%
       String rows=request.getParameter("rows");
       String pageno=request.getParameter("page");
       System.out.println("Rows & Page : "+ rows+ "    "+ pageno);
       String cpage=pageno;
       Connection connect = null;
       Statement statement = null;
       PreparedStatement preparedStatement = null;
       ResultSet rs= null;
       Class.forName("com.mysql.jdbc.Driver").newInstance();
       connect = DriverManager.getConnection("jdbc:mysql://localhost/test?user=root&password=root");
       statement = connect.createStatement();
       rs = statement.executeQuery("SELECT COUNT(*) AS count FROM invheader a, clients b WHERE a.client_id=b.client_id");
       int count=0;
       rs.last();
       count=rs.getInt(1);
       System.out.println("Total No of Records are : "+count);

       int pageval=0;
       pageval=(count/Integer.parseInt(rows));
       int limitstart=0;
       limitstart=(Integer.parseInt(rows)*Integer.parseInt(pageno))-Integer.parseInt(rows);
       int total=count/Integer.parseInt(rows);
       System.out.println("Limit Start : "+limitstart);
       System.out.println("Total : "+total);
       String totalrow=String.valueOf(total+1);
       System.out.println("Total Row : "+totalrow);
       rs = statement.executeQuery("SELECT a.id, a.invdate, b.name, a.amount,a.tax,a.total,a.note FROM invheader a, clients b WHERE a.client_id=b.client_id ORDER BY b.name LIMIT "+limitstart+","+rows);
       //rs = statement.executeQuery("SELECT * FROM grid limit "+limitstart+","+rows);
       JSONObject responcedata=new JSONObject();
       net.sf.json.JSONArray cellarray=new net.sf.json.JSONArray();
       responcedata.put("total",totalrow);
       responcedata.put("page",cpage);
       responcedata.put("records",count);
       net.sf.json.JSONArray cell = new net.sf.json.JSONArray();
       net.sf.json.JSONObject cellobj=new net.sf.json.JSONObject();
       int i=1;
       while(rs.next())
       {
           //System.out.println("Row#: "+i+"      ##"+rs.getString(1)+" : "+rs.getString(2)+" : "+rs.getString(3)+" : "+rs.getString(4)+" : "+rs.getString(5)+" : "+rs.getString(6)+" : "+rs.getString(7)+" : ");
           cellobj.put("id",rs.getInt(1));
           cell.add(rs.getInt(1));
           cell.add(rs.getString(2));
           cell.add(rs.getString(3));
           cell.add(rs.getDouble(4));
           cell.add(rs.getDouble(5));
           cell.add(rs.getDouble(6));
           cell.add(rs.getString(7));
           cellobj.put("cell",cell);
           cell.clear();
           cellarray.add(cellobj);
           i++;
       }
       responcedata.put("rows",cellarray);
       out.println(responcedata);
       System.out.println("Response Data : "+responcedata);
   %>

</body>
</html>

Can anybody help me? If you have a sample project which uses jqGrid along with JSP, It will be very helpful for me.

Thanks in advance,

Nobel.

jQuery Grid Plugin - jqGrid - Topic: jqGrid with JSP

empire on jqGrid with JSP

empire on jqGrid with JSP

brycekmartin on jqGrid with JSP

nobel on jqGrid with JSP