js_date

<section>
    <div class = "container">
        <div class = "row">
            <div class = "col-sm-5 col-sm-offside-1"> <h1>Actual YTD YoY</h1></div>
        </div>
        <div class = "row"><br></div>
        <div class = "row">
            <div class = "col-sm-10 col-sm-offside-3">
            <form class = "form-horizontal">
            <div class = "form-group" >
                <label class = "control-table col-sm-3 col-sm-offside-1">Komisi</label>
                <select class = "control-table col-sm-3 time" name="komisi" id = "komisi">
                    <option value = ""></option>
                    <?php foreach($komisi as $a){ ?>
                    <option value = "<?php echo $a->kdKomisi ?>"><?php echo $a->nmKomisi ?></option>
                    <?php }?>
                </select>
            </div>
            <div class = "form-group" >
                <label class = "control-table col-sm-3 col-sm-offside-1">Periode</label>
                <input type = "date" class = "control-table col-sm-3 col-sm-offside-1 time" name = "start" id = "start">
                <label class = "control-table col-sm-2"> To </label>
                <input type = "date" class = "control-table col-sm-3 time" name = "end" id = "end">
            </div>
        </form>
        <br>

        <div id = "charts">
        </div>
    </div>
</section>
<script>
    var komisi;

    var start;
    var end;

    var chart;
    var tasks = [];
    var tasks2 = [];
    var tasks3 = [];
    var act = [];
    var act2 =[];
    var txt1;

    var judul;
    var id;
    var ids;
    var ress;
    $(document).ready(function()
    {


        $('.time').change(function(){

            tasks = [];
            tasks2 = [];

            komisi = $('#komisi').val();
            start = $('#period').val();
            end = $('#end').val();
            if((komisi != "" || komisi != null) && (start != "" || start != null) && (end != "" || end != null))
            {

                getAll();
            }
            else{

            }



        })

    });
    Array.prototype.max = function() {
        return Math.max.apply(null, this);
    };

    function getAll()
    {
        $("#charts").children().remove();
        komisi = $('#komisi').val();
        start = $('#period').val();
        end = $('#end').val()
        $.ajax({
            url : "<?php echo site_url('jenisPengeluaran/getAct')?>",
            type: "POST",
            data: "start="+start+"&end="+end+"&komisi="+komisi,
            dataType: "JSON",
            success: function(getData)
            {

                if(getData.length > 0)
                {

                    for(var i = 0, count = getData.length; i < count; i++)
                    {
                        //tasks.push(getData[i].nmActivitas);
                        //tasks2.push(getData[i].total);
                        act.push({Act: getData[i].kdActivitas,nmAct: getData[i].nmActivitas});
                        //act2.push(getData[i].nmActivitas);
                        txt1 = '<canvas id = "chart' + i +'"></canvas>';
                        ids = "chart" + i;
                        $("#charts").append(txt1);

                    }
                    for(var j = 0,count2 = act.length;j < count2;j++)
                    {
                        judul = act[j].nmAct;
                        id = act[j].Act;
                        $.ajax({
                            url : "<?php echo site_url('jenisPengeluaran/getAll')?>",
                            type: "POST",
                            data: "start="+start+"&end="+end+"&activitas="+act[j].Act,
                            dataType: "JSON",
                            success: function(getData2)
                            {
                                if(getData2.length > 0)
                                {
                                    tasks[j] = [];
                                    tasks2[j] = [];
                                    //tasks3[j] = [];
                                    for(var k = 0,count3 = getData2.length;k < count3;k++)
                                    {
                                        tasks[j][k] = getData2[k].total;
                                        tasks2[j][k] = getData2[k].ftimes;



                                    }
                                    $.ajax({
                                        url : "<?php echo site_url('jenisPengeluaran/getAllLPJ')?>",
                                        type: "POST",
                                        data: "start="+start+"&end="+end+"&activitas="+id,
                                        dataType: "JSON",
                                        success: function(getData3)
                                        {
                                            if(getData2.length > 0)
                                            {
                                                tasks3[j] = [];
                                                for(var l = 0,count4 = getData3.length;l < count4;l++)
                                                {
                                                    tasks3[j][l] = getData3[l].totalLPJ;
                                                }
                                            }
                                            ress = tasks[j].max() * 2;
                                            var chartdata = {
                                                labels: tasks2[j],
                                                datasets : [
                                                    {
                                                        label: "pengeluaran",
                                                        data: tasks[j],
                                                        borderColor: 'rgb(255, 0, 0)',
                                                        fill: false
                                                    },
                                                    {
                                                        label: "LPJ",
                                                        data: tasks3[j],
                                                        borderColor: 'rgb(0, 0, 255)',
                                                        fill: false
                                                    }
                                                ]
                                            };


                                            var ctx = document.getElementById(ids);

                                            var barGraph = new Chart(ctx, {
                                                type: 'line',
                                                data: chartdata,
                                                options: {

                                                    title: {
                                                        display: true,
                                                        text: judul
                                                    },
                                                    scales: {
                                                        yAxes: [{
                                                            ticks: {
                                                                //suggestedMax: totalLim
                                                                suggestedMax: ress,
                                                                beginAtZero: true
                                                            }
                                                        }]
                                                    }
                                                }

                                            });
                                        }
                                    });
                                }

                            }
                        });
                    }


                }
            }
        });
    }
</script>