ASE Home Page Products Download Purchase Support About ASE
ChartDirector Support
 Forum HomeForum Home   SearchSearch

Message ListMessage List     Post MessagePost Message

  AJAX, Servlet, Method=Post
Posted by elvis on Aug-04-2009 00:28
| Reply | Monitor
Hi sir,

    I would like to update an image by using AJAX method. In javascript, HttpRequest sent to a Servlet with some parameters in POST method. Then, the Servlet updates the chart image.

    How to update an image from Servlet?
    I have to use POST method.

elvis.

  Re: AJAX, Servlet, Method=Post
Posted by Peter Kwan on Aug-04-2009 01:39
| Reply | Monitor
Hi elvis,

As far as I know, no browser supports using POST request for updating an <IMG> tag within a web page.

For your case, if your servlet must use POST, the followings are your options:

(a) Do not use <IMG> tag. Try to use <IFRAME> tag, which supports POST request.

(b) Do not update the image using the Servlet. Update the entire web page, or part of the web page (the part that contains the <IMG> tag). The <IMG> tag must still use a URL that loads the image using a standard GET request, as this is the only request supported by browsers for <IMG> tags. If you update part of the web page, then of course you need to have some AJAX framework on the browser side that knows how to handle this kind of updates.

Hope this can help.

Regards
Peter Kwan

  Re: AJAX, Servlet, Method=Post
Posted by elvis on Aug-04-2009 09:17
| Reply | Monitor
Hi Peter,

     thanks...
     In realtimedemo sample,
     how to pass parameters? the chart is determined by some parameters...

     ...
    <img id="ChartImage1" src="/SOME_SERVLET?chartId=demoChart1">
     ...

function updateDisplay()
{
    ...
    // Update the chart if configured time has elasped
    if ((updatePeriodObj.timeLeft <= 0) && window.JsChartViewer)
        JsChartViewer.get('ChartImage1').streamUpdate();
    ...

}

  Re: AJAX, Servlet, Method=Post
Posted by Peter Kwan on Aug-04-2009 11:22
| Reply | Monitor
Hi Elvis,

You may pass parameters using any method you like. Of course, you must choose methods that are supported by your programming language, your browser and your server. For details, you may need to refer to the HTML/Javascript documentation, and also the documentation of your browser and your server.

The followings are some common parameter passing methods:

(a) Pass parameters as GET query parameters.

(b) Pass parameters as cookies

(c) Pass parameters as session variables

Hope this can help.

Regards
Peter Kwan

  Re: AJAX, Servlet, Method=Post
Posted by elvis on Aug-04-2009 11:41
| Reply | Monitor
Hi Peter,

    Is the following code correct? I dynamically set the src of ChartImage1, then use JsChartViewer to request a new chart.

    function onButtonClick() {
        ...
        chartImage1.src = "="/SOME_SERVLET?building=" + building.value + "&chartId=demoChart1";

        if(window.JsChartViewer) {
JsChartViewer.get('ChartImage1').streamUpdate();
        }
    }

    <body>
        ...
        <img id="ChartImage1">
        ...
    </body>



    Thanks for you support.

Best regards,
Elvis.

  Re: AJAX, Servlet, Method=Post
Posted by elvis on Aug-04-2009 18:29
| Reply | Monitor

    It's quite wired that the img 'ChartImage1' is updated twice when I click the button...



elvis wrote:

    function onButtonClick() {
        ...
        chartImage1.src = "realtimechart.jsp?building=" + building.value + "&chartId=demoChart1";

        if(window.JsChartViewer) {
JsChartViewer.get('ChartImage1').streamUpdate();
        }
    }

    <body>
        ...
        <img id="ChartImage1">
        ...
    </body>


  Re: AJAX, Servlet, Method=Post
Posted by elvis on Aug-04-2009 18:47
| Reply | Monitor
when I click button,
realtimechart.jsp is requested twice,  I log the parameters in the request.

first request, I got "ParameterName=chartId".

second request, I got "ParameterName=chartId, ParameterName=cdDirectStream, ParameterName=cdCacheDefeat".

why realtimechart.jsp is requested twice?
I need to use AJAX, but I dont know where those parameters should be.
Put them in the SRC of the img ?????


elvis wrote:


    It's quite wired that the img 'ChartImage1' is updated twice when I click the button...



elvis wrote:

    function onButtonClick() {
        ...
        chartImage1.src = "realtimechart.jsp?building=" + building.value + "&chartId=demoChart1";

        if(window.JsChartViewer) {
JsChartViewer.get('ChartImage1').streamUpdate();
        }
    }

    <body>
        ...
        <img id="ChartImage1">
        ...
    </body>


  Re: AJAX, Servlet, Method=Post
Posted by Peter Kwan on Aug-04-2009 20:20
| Reply | Monitor
Hi elvis,

The modified realchartchart.jsp sample code sents the request twice because:

(a) ChartDirector sends a request periodically in streamUpdate.

(b) Your own code sends a different request to the server too. Are you aware the following code will immediate send a request to the server? For details on what the following code does, you may refer to your Javascript documentation.

chartImage1.src = "realtimechart.jsp?building=" + building.value + "&chartId=demoChart1";


For your case, you have two methods:

(a) Do not update the SRC of the <IMG> tag. Instead, when the button is pressed, please trigger a POST request to the container page (the "realtimedemo.jsp"). In the "realtimedemo.jsp", please set the SRC of the <IMG> tag to the URL you want.

(b) If you want to update the SRC of the <IMG> tag, then do not use "streamUpdate". Instead, you may periodically update the SRC yourself to periodically send requests to the server.


Hope this can help.

Regards
Peter Kwan

  Re: AJAX, Servlet, Method=Post
Posted by elvis on Aug-04-2009 23:59
| Reply | Monitor
Hi Peter,

    Now, I send a HTTP POST request to a servlet when the button is clicked, and it returns an IMG URL. When it returns, I update the IMG's SRC by the responsed IMG URL.
    It works fine...

    Thanks for your support...

Best regards,
elvis.