CODEWITHSUNDEEP
jquerylaravelhighcharts
Thilagam
Thilagam

Reputation: 65

How to set the dynamic value from a text box to the graph using Highcharts?

I am trying to populate the graph which is drawn using Highcharts, with the dynamic value from text box. Below is my code for the chart:

<script type="text/javascript">
    var pendingSSC = $("#pendingSSC").val();
    var pendingAgency = $("#pendingAgency").val();
    Highcharts.chart('container',{
        chart:{
            type: 'column'
        },
        title:{
            text: 'Pivot Table'
        },
        xAxis: {
            categories: ['Pivot data']
        },
        yAxis:{
            allowDecimals: false,
            min: 0,
        },
        tooltip: {
            formatter: function () {
                return '<b>' + this.x + '</b><br/>' +
                    this.series.name + ': ' + this.y + '<br/>' +
                    'Total: ' + this.point.stackTotal;
            }
        },
        plotOptions: {
            column: {
                stacking: 'normal'
            }
        },
        series:[
            {
                name:'Pending-SSC',
                data:[pendingSSC],
                stack:'pending'
            },
            {
                name:'Pending-Agency',
                data:[pendingAgency],
                stack:'pending'
            }

        ]
    });
</script>

I have to draw this chart on success of an ajax function.

The chart accepts a static value. For some reason it does not accept the dynamic values.

The values are empty.

Upvotes: 1

Views: 240

Answers (1)

Patata
Patata

Reputation: 273

Highcharts accepts number in data array so update 

var pendingSSC =Number($("#pendingSSC").val())
var pendingAgency = Number($("#pendingAgency").val());

Upvotes: 1

Related Questions