Scribd
Upload
460 views7 pages

JqGrid Starter

The document describes setting up jqGrid, a jQuery plugin for displaying tabular data, on a web page. It includes the necessary script and link tags to include jqGrid and supporting files. JavaScript code is provided to initialize and configure a jqGrid instance, including defining columns, loading data via Ajax from a servlet, handling row selection, and enabling editing of rows. The servlet code to interface with a database and return XML data for the grid is also included.

Uploaded by

Jonah Mwogi
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 PDF, TXT or read online on Scribd
460 views7 pages

JqGrid Starter

The document describes setting up jqGrid, a jQuery plugin for displaying tabular data, on a web page. It includes the necessary script and link tags to include jqGrid and supporting files. JavaScript code is provided to initialize and configure a jqGrid instance, including defining columns, loading data via Ajax from a servlet, handling row selection, and enabling editing of rows. The servlet code to interface with a database and return XML data for the grid is also included.

Uploaded by

Jonah Mwogi
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 PDF, TXT or read online on Scribd
You are on page 1/ 7

New To jqGrid : Starter

-----------------------------------------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"


"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>OpenStores</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="scripts/jquery-1.4.4.min.js"
type="text/javascript"></script>
<script src="scripts/grid.locale-en.js" type="text/javascript"></script>
<script src="scripts/jquery.jqGrid.min.js"
type="text/javascript"></script>
<link href="css/jquery-ui-1.8.2.custom.css" rel="stylesheet"
type="text/css" />
<link href="css/ui.jqgrid.css" rel="stylesheet" type="text/css" />
<script>
function fillGridOnEvent(){
$("#jQGrid").html("<table id=\"list\"></table><div
id=\"page\"></div>");
var lastsel;
jQuery("#list").jqGrid({
url:'<%=request.getContextPath()%>/JQGridServlet?
q=1&action=fetchData',
datatype: "xml",
height: 250,
colNames:['Sr. No.','Supplier Name','Phone No.','E-mail'],
colModel:[
{name:'s_Id',index:'s_Id',
width:90,sortable:true,editable:true,
editoptions:{readonly:true,size:10}, align:"right"},
{name:'sName',index:'sName', width:130,sortable:false,
editable:true},
{name:'sPhone',index:'sPhone', width:100,sortable:false,
editable:true},
{name:'sEmail',index:'sEmail' ,sortable:false,
editable:true}
],
multiselect: false,
rownumbers: true,
paging: true,
pager: $("#page"),
//loadonce:true,
autowidth:true,
caption: "Suppliers Detail",
sortname: 's_Id',
viewrecords: true,
sortorder: "desc",
onSelectRow: function(s_Id){
if(s_Id && s_Id!==lastsel){
jQuery('#list').jqGrid('restoreRow',lastsel);
jQuery('#list').jqGrid('editRow',s_Id,true, '',
'', '', '', reload);
lastsel=s_Id;
}
},
editurl: "<%=request.getContextPath()%>/JQGridServlet?
q=1&action=EditData"
}).navGrid('#page',{edit:false,add:false,del:false});

//jQuery("#list").jqGrid('navGrid',"#page",
{edit:false,add:false,del:false});

}
function reload() {
$("#list").trigger("reloadGrid");
}
</script>
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
</head>
<body onload="fillGridOnEvent();">
<div id="wrap">
<div id="header">
<h1><a href="#"><strong>OpenSTORES</strong></a></h1>
<br/>
<h2>MTRH - AMPATH Store</h2>
</div>
<div id="content">
<div class="left">
<form action="JQGridServlet" id="gridForm" method="POST">
<div id="jQGrid" align="center"></div>
</form>
</div>
<div class="right">
Links
</div>
<div style="clear: both;"> </div>
</div>
</div>
</body>
</html>

:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::

/*
* To change this template, choose Tools | Templates
* and open the template in the editor.
*/

package org.openstore.controller;

import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

@SuppressWarnings("serial")
public class JQGridServlet extends HttpServlet {

protected void processRequest(HttpServletRequest request, HttpServletResponse response)


throws ServletException, IOException {
PrintWriter out = response.getWriter();
try {

if (request.getParameter("action").equals("fetchData")) {
response.setContentType("text/xml;charset=UTF-8");

String sidx = request.getParameter("sidx");


String sord = request.getParameter("sord");

String rows = request.getParameter("rows");


String page = request.getParameter("page");

int totalPages = 0;
int totalCount = 0;
int totPg = Integer.parseInt(page);
if(sidx == null)
sidx ="1";
try {
Connection con = new dbController().dbCon();
Statement stmt = con.createStatement();
String strSql = "SELECT COUNT(*) AS count FROM suppliers";
ResultSet rs = stmt.executeQuery(strSql);
rs.next();
int total = rs.getInt(1);
totalCount = total;
con.close();
} catch (Exception e) {
// TODO: handle exception
}

if (totalCount > 0) {
if (totalCount % Integer.parseInt(rows) == 0) {
totalPages = totalCount / Integer.parseInt(rows);
} else {
totalPages = (totalCount / Integer.parseInt(rows)) + 1;
}

} else {
totalPages = 0;
}
System.out.println("\n\n"+ totPg + "\n");///////////

if (totPg>totalPages)
totPg = totalPages;
System.out.println("\n"+ totPg + "\n\n");/////////////////
int start = Integer.parseInt(rows)*totPg - Integer.parseInt(rows);
try {
Connection con = new dbController().dbCon();
Statement stmt = con.createStatement();
String strSql = "SELECT * FROM suppliers ORDER BY " + sidx +" " + sord +"
" + //
"LIMIT " + start +" ," + Integer.parseInt(rows);
ResultSet rs = stmt.executeQuery(strSql);
/*String total="0";
while(rs.next())
total = rs.getString(1);
totalCount = Integer.parseInt(total);*/
con.close();
} catch (Exception e) {
// TODO: handle exception
}

out.print("<?xml version='1.0' encoding='utf-8'?>\n");


out.print("<rows>");
out.print("<page>" + totPg + "</page>");

out.print("<total>" + totalPages + "</total>");


out.print("<records>" + totalCount + "</records>");

Connection con = new dbController().dbCon();


try {
Statement stmt = con.createStatement();
String strSql = "Select * From suppliers ORDER BY " + sidx +" " + sord +" "
+ //
"LIMIT " + start +" ," + Integer.parseInt(rows);
ResultSet rs = stmt.executeQuery(strSql);

int x=1;
out.print("<row id='" + (x-1) + "'>");
out.print("<cell>[+]</cell>");
out.print("<cell></cell>");
out.print("<cell></cell>");
out.print("<cell></cell>");
out.print("</row>");
x++;
while (rs.next()) {
out.print("<row id='" + (x-1) + "'>");
out.print("<cell>" + rs.getString(1) + "</cell>");
out.print("<cell>"+ rs.getString(2) +"</cell>");
out.print("<cell>"+ rs.getString(3) +"</cell>");
out.print("<cell>"+ rs.getString(4) +"</cell>");
out.print("</row>");
x++;
}

con.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
out.print("</rows>");
}else if(request.getParameter("action").equals("EditData")){

try {

String strName = request.getParameter("sName");


String strEmail = request.getParameter("sEmail");
String strPhone = request.getParameter("sPhone");
String strId = request.getParameter("s_Id");
if ((!strId.trim().equals(""))&(!strId.trim().equals("[+]")))
{
try {
Connection con = new dbController().dbCon();
Statement stmt = con.createStatement();
String strSql = "UPDATE suppliers SET s_Name='" + strName +
"', s_PhoneNo='"+ strPhone +"',s_Email='"+ strEmail +"" +
"'WHERE s_Id='" + strId +"'";
System.out.println(strSql);
stmt.executeUpdate(strSql);
con.close();
} catch (Exception e) {
// TODO: handle exception
}

}else{
try {
String sidx = request.getParameter("sidx");
String sord = request.getParameter("sord");
Connection con = new dbController().dbCon();
Statement stmt = con.createStatement();
String strSql = "INSERT INTO suppliers(s_Name, s_PhoneNo,
s_Email) " +
"Values('" + strName +"','"+ strPhone +"','"+
strEmail +"')";
System.out.println(strSql);
stmt.executeUpdate(strSql);
String strSqlsel = "Select * From suppliers ORDER BY " + sidx +" " + sord;
ResultSet rs = stmt.executeQuery(strSqlsel);

int x=1;
out.print("<row id='" + (x-1) + "'>");
out.print("<cell>[+]</cell>");
out.print("<cell></cell>");
out.print("<cell></cell>");
out.print("<cell></cell>");
out.print("</row>");
x++;
while (rs.next()) {
out.print("<row id='" + (x-1) + "'>");
out.print("<cell>" + rs.getString(1) + "</cell>");
out.print("<cell>"+ rs.getString(2) +"</cell>");
out.print("<cell>"+ rs.getString(3) +"</cell>");
out.print("<cell>"+ rs.getString(4) +"</cell>");
out.print("</row>");
x++;
}
con.close();
/**/
} catch (Exception e) {
// TODO: handle exception
}
}
} catch (Exception e) {
// TODO: handle exception
}

} finally {
out.close();
}
}

@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
processRequest(request, response);
}

@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
processRequest(request, response);
}

@Override
public String getServletInfo() {
return "Short description";
}

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy