Question

Event.observe(document,  dom:loaded , function() {

    new Ajax.Request( /HumblFin/Serv , {
        method: get ,
        onSuccess: function(transport){
            var data = transport.responseText.evalJSON();
            drawChart(data);
        },
        onFailure: function(){ alert( Something went wrong... ) }
    });


function drawChart(data)
{

     for (var i = 0; i < data.jobs.length; i++)  { 
         priceData.push([i, data.jobs[i].INCPU]);
         dateData.push(data.jobs[i].Dater);

        }
}

Hereafter completion of the drawchart(data) method only I want to execute the below code but unfortunately the function HumbleFinance.init is being called with empty data.

Please tell me how to solve this. I can t put the below code inside the drawChart(data) function

HumbleFinance.init( finance , priceData , dateData);
Event.observe(HumbleFinance.containers.summary,  flotr:select , function (e) {

    var area = e.memo[0];
    xmin = Math.floor(area.x1);
    xmax = Math.ceil(area.x2);

    var date1 = dateData[xmin];
    var date2 = dateData[xmax];

    $( dateRange ).update(dateData[xmin] +   -   + dateData[xmax]);

});
});

Answer 1

Your call to HumbleFinance.init() is happening before you get your ajax response and process the data results. You need to make sure you process your ajax response before you call this init. To do that, you just move the init call to within the onSuccess callback, after the drawChart method call.

<script>
Event.observe(document,  dom:loaded , function() {

    new Ajax.Request( /HumblFin/Serv , {
        method: get ,
        onSuccess: function(transport){
            var data = transport.responseText.evalJSON();
            drawChart(data);

            //Put your HumbleFinance.init call here, 
            //after the priceData and dateData has been generated.
            HumbleFinance.init( finance , priceData , dateData);
        },
        onFailure: function(){ alert( Something went wrong... ) }
    });

    Event.observe(HumbleFinance.containers.summary,  flotr:select , function (e) {

        var area = e.memo[0];
        xmin = Math.floor(area.x1);
        xmax = Math.ceil(area.x2);

        var date1 = dateData[xmin];
        var date2 = dateData[xmax];

        $( dateRange ).update(dateData[xmin] +   -   + dateData[xmax]);

    });
});

友情链接