Codeigniter - Rango de Fechas Charts Js en Codeigniter

   
Vista:

Rango de Fechas Charts Js en Codeigniter

Publicado por Andres Mantilla dams1801@hotmail.com (1 intervención) el 05/09/2017 17:21:24
Buenos dias, estoy realizando unos reportes graficos con la libreria charts.js , la cual ya me funciona para traer los datos de la bd, ahora quiero adaptar un rango de fechas que ingresa el usuario para hacer mas especifico el reporte, el inconveniente es que no me llegan las variables a la colsulta que hago en el modelo. no se si la estoy haciendo mal ya que es la primera vez que uso json y javascript.


El código del modelo:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
public function getPersonas(){
 
//$this->db->where("fecha BETWEEN '2017/06/23' AND '2017/08/23'");
 $this->db->where("fecha BETWEEN 'fecha_inicial' AND 'fecha_final'");
    // $this->db->where("fecha >= DATE_SUB(NOW(),INTERVAL 2 MONTH)", NULL, FALSE);
       $this->db->where('name','02SERGIO');
       $this->db->where("resultado  >", "1500000");
        $this->db->select('name, resultado, nombre');
 
        $this->db->from('cliente');
        $query = $this->db->get();
 
        return $query->result();
    }

El código de la vista:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
<input type="button" id="btnBuscar" value="Graficar">
<button id="save-btn">Save Chart Image</button>
<br><br>
<div id="contenedor_grafico">
<form name="form" action="" method="post">
<p>Fecha inicio: <input type="text" id="inicio" name="inicio">  fecha Final: <input type="text" id="final" name="final"></p>
 </form>
 
        <canvas id="myChart" width="450" height="400"></canvas>
</div>
 
 
 
<script>
 
var paramNombres = [];
var paramEdades = [];
var paramClientes = [];
 
var paramFecha = [];
var bgColor = [];
var bgBorder = [];
 
 
$('#btnBuscar').click(function(){
 
  var fecha_inicial=$('#inicio').val();
  var fecha_final=$('#final').val();
 
 
 
    $.post("<?php echo base_url();?>index.php?Bank/getPersonas",
 
    function(data){
 
 
              var obj = JSON.parse(data);
             document.getElementById("inicio").value=fecha_inicial;
              document.getElementById("final").value=fecha_final;
 
              paramNombres = [];
                  paramEdades  = [];
                            paramClientes = [];
                            paramFecha = [];
 
              bgColor      = [];
                    bgBorder     = [];
 
 
                      $.each(obj, function(i,item){
 
                        var r = Math.random() * 255;
                            r = Math.round(r);
 
                        var g = Math.random() * 255;
                            g = Math.round(g);
 
                        var b = Math.random() * 255;
                            b = Math.round(b);
 
                                paramNombres.push(item.name);
                                paramEdades.push(item.resultado);
                                                paramClientes.push(item.nombre);
                                                paramFecha.push(item.fecha);
 
                        bgColor.push('rgba('+r+','+g+','+b+', 0.3)');
                                bgBorder.push('rgba('+r+','+g+','+b+', 1)');
 
                            });
 
      $('#myChart').remove();
            $('#contenedor_grafico').append("<canvas id='myChart' width='450' height='400'></canvas>");
 
              var ctx = $('#myChart');
              var chart = new Chart(ctx, {
                  // The type of chart we want to create
                  type: 'bar',
 
                  // The data for our dataset
                  data: {
                      labels: paramClientes,
 
                      datasets: [{
                          label: "Clientes Aprobados 02Sergio",
                          backgroundColor: bgColor,
                          borderColor: bgBorder,
                          borderWidth: 1,
                          data: paramEdades,fecha_inicial:fecha_inicial,fecha_final:fecha_final,
 
                      }]
 
                  },
 
                  // Configuration options go here
                                    options: {
  responsive: false
}
              });
      });
});
 
</script>

Gracias a de antemano.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder