I cant provide the exact code since there are lot of other
functionalities going around the project but i will send the
equivalent code
IDE netbeans ...web apps... suppose i have my mysql db integrated with
my IDE
so...
the 1st html page which will call servlet onclick event
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;
charset=UTF-8">
</head>
<body>
<form name="go" action="Sqltest">
<input type="submit" value="sub" name="sub" />
</form>
</body>
</html>
now the servlet will fetch the entire table and show the json string
on clients browser as a response to the event click ...
import com.google.visualization.datasource.Capabilities;
import com.google.visualization.datasource.DataSourceHelper;
import com.google.visualization.datasource.DataSourceServlet;
import com.google.visualization.datasource.DataTableGenerator;
import com.google.visualization.datasource.base.DataSourceException;
import com.google.visualization.datasource.datatable.DataTable;
import com.google.visualization.datasource.query.Query;
import com.google.visualization.datasource.util.SqlDataSourceHelper;
import
com.google.visualization.datasource.util.SqlDatabaseDescription;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class SqlTest extends HttpServlet implements
DataTableGenerator
{
protected void processRequest(HttpServletRequest request,
HttpServletResponse response)
throws ServletException, IOException {
try {
DataSourceHelper.executeDataSourceServletFlow(request,
response, this, isRestrictedAccessMode());
//i tried calling the next html page drawchart.html using
// RequestDispatcher rd;
// rd = getServletContext().getRequestDispatcher("drawchart.html or
drawchart.jsp but the code is the same ");
// rd.forward(request, response);
//sendredirect method
// refresh method
//but i dont know when the servlet is going to laod the entire json
string on clients browser ... so the above methods are of no use
}
catch(Exception e){
System.out.println(e.getMessage());
}
}
@Override
public DataTable generateDataTable(Query query, HttpServletRequest
request)
throws DataSourceException {
SqlDatabaseDescription dbDescription = new
SqlDatabaseDescription("jdbc:mysql://10.0.0.230:3306/
test","atuser","pwd","userk");//url,user,pass,tablename
return SqlDataSourceHelper.executeQuery(query, dbDescription);
}
@Override
public Capabilities getCapabilities() {
return Capabilities.SQL;
}
protected boolean isRestrictedAccessMode() {
return false;
}
@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";
}// </editor-fold>
}
But to draw the chart i am calling the drawchart html page manually
since i can call it after the json string is seen on the browser.
<html>
<head>
<title>Getting Started Example</title>
<!--Load the AJAX API-->
<script type="text/javascript" src="http://www.google.com/jsapi";></
script>
<script type="text/javascript">
//Load the Visualization API and the ready-made Google table
visualization
google.load('visualization', '1', {'packages':
['annotatedtimeline']});
// Set a callback to run when the API is loaded.
google.setOnLoadCallback(init);
// Send the query to the data source.
function init() {
// Specify the data source URL.
var query = new google.visualization.Query('Sqltest');//NAME OF
SERVLET WHICH GIVES RESPONSE TO THE CLIENT REQUEST WITH A
query.response JSON string to client browser
// Send the query with a callback function.
query.send(handleQueryResponse);
}
// Handle the query response.
function handleQueryResponse(response) {
if (response.isError()) {
alert('Error in query: ' + response.getMessage() + ' ' +
response.getDetailedMessage());
return;
}
// Draw the visualization.
var data = response.getDataTable();
var chart = new
google.visualization.AnnotatedTimeLine(document.getElementById('chart_div') );
chart.draw(data, {displayAnnotation: true});
}
</script>
</head>
<body>
<h1>Hello! Data Source!</h1>
A table chart that shows data taken from the simple data source.
<!--Div that will hold the visualization-->
<div id="chart_div" style='width: 700px; height:240px;'></div>
</body>
</html>
so the flow of events are
1st html page- the user clicks Ok button and calls the servlet
2nd the servlet fetch data from mysql table and shows a json string on
clients browser.
3rd the drawchart.html page which draws the chart.
Problem: How can I directly call 3rd after 2nd (after servlet have
loaded the json string entirely on clients browser)
As mentioned in the servlet code comment i tried calling 3rd using
response.forward() , sendredirect and also auto refresh method.
Any guidance will be of immense help for me
Thanks & regards,
Akku
On Jun 20, 5:36 am, MC Get Vizzy <[email protected]> wrote:
> On Sun, Jun 20, 2010 at 12:10 AM, Student <[email protected]> wrote:
> > Sorry I am not able to express properly
> > So the code is like.
> > I have an html page where a user clicks OK button
> > when client hits ok i call the servlet the code is as
> > follows..............
>
> can you send me the code that handles the click on the OK button?
> your code to draw the chart should be on the same HTML page. you should not
> be loading a new HTML page to draw the chart.
>
>
>
>
>
> > public class SqlTest extends HttpServlet implements DataTableGenerator
> > {
> > protected void processRequest(HttpServletRequest request,
> > HttpServletResponse response)
> > throws ServletException, IOException {
>
> > try {
> > DataSourceHelper.executeDataSourceServletFlow(request,
> > response, this, isRestrictedAccessMode());
>
> > }
> > catch(Exception e){
> > System.out.println(e.getMessage());
> > }
> > }
> > @Override
> > public DataTable generateDataTable(Query query, HttpServletRequest
> > request)
> > throws DataSourceException {
> > SqlDatabaseDescription dbDescription = new
> > SqlDatabaseDescription("jdbc:mysql://10.0.0.230:3306/
> > test","atuser","pwd","userk");//url,user,pass,tablename
> > return SqlDataSourceHelper.executeQuery(query, dbDescription);
> > }
>
> > �...@override
> > public Capabilities getCapabilities() {
> > return Capabilities.SQL;
> > }
>
> > protected boolean isRestrictedAccessMode() {
> > return false;
> > }....etc
>
> > Now when the servlet is called it generates hte json string on the
> > browser as given in the tutorials....
> > The text begins with google.visualization.Query.setResponse
> > and ends with /Tiger'},{v:80.0},{v:false}]}]}});
>
> > #So this string is seen on the clients browser ... since he has
> > requested by clicking OK button.
>
> > So since the Json string is loaded into clients browser ... he calls
> > the following HTML page to see the chart....
>
> > CLIENT CODE IS AS FOLLOWS -->BUT IT SHOULD BE CALLED ONLY WHEN THE
> > SERVLET COMPLETLY SENDS google.visualization.Query.setResponse json
> > string to the clients browser
> > <html>
> > <head>
> > <title>Getting Started Example</title>
> > <!--Load the AJAX API-->
> > <script type="text/javascript" src="http://www.google.com/jsapi";></
> > script>
> > <script type="text/javascript">
>
> > //Load the Visualization API and the ready-made Google table
> > visualization
> > google.load('visualization', '1', {'packages':
> > ['annotatedtimeline']});
>
> > // Set a callback to run when the API is loaded.
> > google.setOnLoadCallback(init);
>
> > // Send the query to the data source.
> > function init() {
>
> > // Specify the data source URL.
> > var query = new google.visualization.Query('GoogleProcessor');//
> > NAME OF SERVLET WHICH GIVES RESPONSE TO THE CLIENT REQUEST WITH A
> > query.response JSON string to client browser
>
> > // Send the query with a callback function.
> > query.send(handleQueryResponse);
> > }
>
> > // Handle the query response.
> > function handleQueryResponse(response) {
> > if (response.isError()) {
> > alert('Error in query: ' + response.getMessage() + ' ' +
> > response.getDetailedMessage());
> > return;
> > }
>
> > // Draw the visualization.
> > var data = response.getDataTable();
> > var chart = new
>
> > google.visualization.AnnotatedTimeLine(document.getElementById('chart_div')
> > );
> > chart.draw(data, {displayAnnotation: true});
> > }
> > </script>
> > </head>
> > <body>
> > <h1>Hello! Data Source!</h1>
>
> > A table chart that shows data taken from the simple data source.
> > <!--Div that will hold the visualization-->
> > <div id="chart_div" style='width: 700px; height:240px;'></div>
> > </body>
> > </html>
>
> > so the client can see the chart now............
>
> > Now according to my requirement when the servlet process the data and
> > send the json string on the clients browser, Once the json is loaded
> > completly to the clients browser i should call the
> > above HTML page which draws the chart.
> > How can i do it?
> > what I tried was ......
> > request dispatcher --> which calls the chart drawing html page att the
> > end of the servlet code.
> > It did not work since the Json string takes time to get loaded in
> > clients browser.
> > sendredirect -->dont work either due to the same reason.
>
> > I am completly new to the webpage world...
> > I think that I have to write a code were-in the client browser get the
> > idea that the json string is completly loaded into its browser and its
> > time to call the HTML page to see the chart.
> > i think that ajax,jquery has the ability to know that the servlet has
> > loaded the json string completly on client side and we can call the
> > HTML page to see the chart.
> > i read some were"" getjson()""" command in jquery which can so that
> > trick.
> > Please guide me about how to get the idea that the servlet has
> > processed and have loaded the json string COMPLETELY on the clients
> > browser and then we can call the HTML page to see the chart.
> > Ya, and there are no errors in the code... that i have posted ...
> > thanks & reagards,
> > Akku
>
> > On Jun 16, 5:44 am, MC Get Vizzy <[email protected]> wrote:
> > > I'm having a hard time understanding what's going on here. Can you paste
> > > your client code where you send the query?
>
> > > On Mon, Jun 14, 2010 at 4:52 PM, akshay dange <[email protected]
> > >wrote:
>
> > > > Is there anyway to " ELIMINATE " the beautiful string from coming on
> > > > clients
> > > > browser
>
> > > > On Sun, Jun 13, 2010 at 6:04 PM, CounterStrike <
> > [email protected]>wrote:
>
> > > >> Hi
> > > >> I have to design such that whenever user pass a query I process it
> > > >> using servlet and then call the js page to draw the chart
>
> > > >> 1> user writes a query on a page
> > > >> 2> the page call the servelt class
> > > >> public class MyServlet extends Httpservlet implements
> > > >> DataSourceServlet {..... return data
> > > >> The user see a beautiful string like this..
> > > >> google.visualization.Query.setResponse......... /Tiger'},{v:80.0},
> > > >> {v:false}]}]}});
> > > >> 3> when the user hits on different html page myhtml.js it draws the
> > > >> chart.
>
> > > >> I want the Myservlet class itself call the myhtml.js page and draw
> > > >> the chart directly.
> > > >> and want to eliminate the beautiful string
> > > >> google.visualization.Query.setResponse......... /Tiger'},{v:80.0},
> > > >> {v:false}]}]}});
> > > >> from coming on user's browser
> > > >> What should i do?
> > > >> I tried using functions to call another page like request
> > > >> dispatcher(), redirect() calling myhtml.js page directly after
> > > >> myservlet process the query results.
> > > >> But i get the result like this
> > > >> google.visualization.Query.setResponse......... /Tiger'},{v:80.0},
> > > >> {v:false}]}]}});
> > > >> and the entire myhtml.js code page below it on the browsers that to
> > > >> without the chart been draw.
>
> > > >> Is there anyway to element the beautiful string from coming on clients
> > > >> browser
> > > >> and only show them the chart been drawn ? :)
>
> > > > --
> > > > You received this message because you are subscribed to the Google
> > Groups
> > > > "Google Visualization API" group.
> > > > To post to this group, send email to
> > > > [email protected].
> > > > To unsubscribe from this group, send email to
> > > > [email protected]<google-visualization-
> > > > api%[email protected]><google-visualization-
> > api%[email protected] <api%[email protected]>>
> > > > .
> > > > For more options, visit this group at
> > > >http://groups.google.com/group/google-visualization-api?hl=en.
>
> > --
> > You received this message because you are subscribed to the Google Groups
> > "Google Visualization API" group.
> > To post to this group, send email to
> > [email protected].
> > To unsubscribe from this group, send email to
> > [email protected]<google-visualization-
> > api%[email protected]>
> > .
> > For more options, visit this group at
> >http://groups.google.com/group/google-visualization-api?hl=en.
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-visualization-api?hl=en.
