0

I have a method that get data from database and show it on chart. Its working fine. Now, i need to put some filters on it, and I'm facing dificulties to pass my parameters to the controller.

$("#quadro").click(function () {

    Highcharts.setOptions({
        lang: {
            decimalPoint: ',',
            thousandsSep: '.'
        }
    });

    var data1 = $('#data1').val();
    var data2 = $('#data2').val();
    var empresa = $('#empresa option:selected').text();   

    $.ajax({
        url: 'Painel/QuadroReceitas',
        dataType: "json",
        type: "GET",
        contentType: 'application/json; charset=utf-8',
        data: { 'data1': data1, 'data2': data2, 'empresa': empresa },
        async: false,
        processData: false,
        cache: false,
        delay: 15,
        success: function (data) {

            var Categories = new Array();
            var FaturadoArray = new Array();
            var RecebidoArray = new Array();
            var AtrasadoArray = new Array();

            for (var i in data) {
                Categories.push(data[i].Mes);
                FaturadoArray.push(data[i].Receitas);
                RecebidoArray.push(data[i].Recebido);
                AtrasadoArray.push(data[i].Inad_Atual);
            }

            var MesArray = JSON.parse(JSON.stringify(Categories));
            quadroReceitas(MesArray, FaturadoArray, RecebidoArray, AtrasadoArray);
        },

        error: function (xhr) {
            alert('error');
        }
    });
});


function quadroReceitas(MesArray, FaturadoArray, RecebidoArray, AtrasadoArray) {

    var GlobalRotation = -90;
    var GlobalAlign = 'right';
    var X;
    var Y;

    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'column',
            realignLabels: true,
            animation: false
        },

        title: {
            text: 'Quadro de Receitas'
        },

        legend: {
            align: 'left',
            verticalAlign: 'top',
            floating: true,
            x: 0,
            y: 0
        },

        xAxis: {
            categories: MesArray,
            crosshair: true,
        },

        yAxis: {
            labels: { enabled: false },
            title: { enabled: false },
        },

        credits: {
            enabled: false
        },

        tooltip: {
            headerFormat: '<span style="font-size:10px">{point.key}</span><table>',

            pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                '<td style="padding:0"><b>{point.y:,.1f}</b></td></tr>',
            footerFormat: '</table>',
            shared: true,
            useHTML: true
        },

        plotOptions: {
            column: {
                animation: true,
                pointPadding: 0.05, // Defaults to 0.1
                groupPadding: 0.05, // Defaults to 0.2

                dataLabels: {
                    enabled: true,
                    rotation: GlobalRotation,
                    color: '#FFFFFF',
                    align: GlobalAlign,
                    verticalAlign: "top",
                    y: 10,
                    inside: false,
                    crop: false,

                    style: {
                        fontSize: '12px',
                        fontFamily: 'Verdana, sans-serif'
                    },

                    formatter: function () {
                        return Highcharts.numberFormat(this.y, 2);
                    }
                }
            },
        },

        series: [
            { name: 'Faturado', color: '#004a91', data: FaturadoArray },
            { name: 'Recebido', color: '#009147', data: RecebidoArray },
            { name: 'Atrasado', color: '#FF0000', data: AtrasadoArray }
        ]
    });
}

On Controller i have the code as bellow:

  [HttpGet]
        public JsonResult QuadroReceitas(string data1, string data2, string empresa)
        {
            if(empresa == "empresa" || empresa == null)
            {
                empresa = "%";
            }            

            //Chave oChave = new Chave();
            DateTime agora = DateTime.Now;
            var start = new DateTime(agora.Year, agora.Month, 1).AddMonths(-11);
            var end = new DateTime(agora.Year, agora.Month, 1).AddMonths(1).AddDays(-1);

            if (data1 == null)
                data1 = start.ToShortDateString();

            if (data2 == null)
                data2 = end.ToShortDateString();

            ContasReceberData recData = new ContasReceberData();
            List<ContasReceber> receitas = new List<ContasReceber>();

            receitas = recData.GetQuadroReceitas(data1, data2, empresa)
                .Select(o => new ContasReceber
                {
                    Mes = o.Mes,
                    Receitas = Math.Round(o.Receitas,2),
                    Recebido = Math.Round(o.Recebido, 2),
                    Inad_Atual = Math.Round(o.Inad_Atual, 2)
                }).ToList();

            return Json(receitas, JsonRequestBehavior.AllowGet);
        }  

As I told, it is working fine, but without the parameters:

data1, data2, empresa

I tried to change on AJAX to POST and Controller to HttpPost as i read in another topic but didnt work.

3
  • Remove the contentType: 'application/json; charset=utf-8', option (your not stringifying your data) Commented Feb 10, 2016 at 0:30
  • Also remove processData: false, Commented Feb 10, 2016 at 0:43
  • Worked, thanks Stephen!!! Commented Feb 10, 2016 at 11:23

1 Answer 1

3

Because in your ajax method you set processData=false. set it to true or delete the line of processData and it's work!

var empresa = $('#empresa option:selected').text();   

$.ajax({
    url: 'Painel/QuadroReceitas',
    dataType: "json",
    type: "GET",
    contentType: 'application/json; charset=utf-8',
    data: { 'data1': data1, 'data2': data2, 'empresa': empresa },
    async: false,
    // processData: false,
    cache: false,
    delay: 15,
    success: function (data) {

        var Categories = new Array();
        var FaturadoArray = new Array();
        var RecebidoArray = new Array();
        var AtrasadoArray = new Array();

        for (var i in data) {
            Categories.push(data[i].Mes);
            FaturadoArray.push(data[i].Receitas);
            RecebidoArray.push(data[i].Recebido);
            AtrasadoArray.push(data[i].Inad_Atual);
        }

        var MesArray = JSON.parse(JSON.stringify(Categories));
        quadroReceitas(MesArray, FaturadoArray, RecebidoArray, AtrasadoArray);
    },

    error: function (xhr) {
        alert('error');
    }
});

});

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.