Graph that feeds data from the bank

Question

Graph that feeds data from the bank

Navigation

#1 by (0 votes)

0

I have a system that shows a table that prints each record with a button next to it responsible for opening a modal.

I would like to have a graph that compares the record data equivalent to the clicked button.

The problem is that, as you can see in the code, I only have a button with a modal that repeats itself on each line while there is registration, that is, I will also need a single graphic that adapts depending on the registry of the button clicked.

I believe that I already got the ID of the button clicked, sent to php and made the graph, the problem is that I do not even know how to put the graph inside the modal, who will say how the modal will understand which is the ID of the record clicked and show the graph of that record.

But the problem is that some things in php are very different from python and I do not master php enough to do this.

In addition, you still have to put the graph in the modal and I have no idea how to do this.

Can anyone show me how to do these things and if this works out?

    <!-- Main -->
    <div class="content-lg container">
        <div class="row margin-b-20">
            <div class="col-sm-6">
                <h2>Resultados</h2>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12 sm-margin-b-50">

                <script type="text/javascript">
                    //Pegar o ID do botão clicado 
                    function abreModal (idR)
                    {
                        $.post("/Teste_Obeya/ajax.php", 
                        { id : idR }, function(content){
                            $(".modal-body").html(content); 
                        }, 'html');
                    }
                </script>


                        <?php

                        require 'conn.php';

                        //Conexão e consulta ao Mysql
                        $qry = mysqli_query($lnk, "select * from qualite");

                        //Pegando os nomes dos campos
                        $num_fields = mysqli_num_fields($qry);//Obtém o número de campos do resultado

                        for($i = 0;$i<$num_fields; $i++){//Pega o nome dos campos
                            $fields[] = mysqli_fetch_field_direct($qry,$i)->name;
                        }

                        //Montando o cabeçalho da tabela
                        $table = '<table class="table table-hover table-inverse"> <tr style="">';

                        for($i = 0;$i < $num_fields; $i++){
                            $table .= '<th>'.$fields[$i].'</th>';
                        }

                        //Montando o corpo da tabela
                        $table .= '<tbody >';
                        while($r = mysqli_fetch_array($qry)){
                            $table .= '<tr>';
                            for($i = 0;$i < $num_fields; $i++){
                                $table .= '<td>'.$r[$fields[$i]].'</td>';
                            }

                            // Adicionando botão de edição

                            $table .= '<td><form action="qualite-edicao.php" method="post">'; 
                            $table .= '<input type="hidden" name="ID" value="'.$r['ID'].'">';
                            $table .= '<input type="hidden" name="KPI" value="'.$r['KPI'].'">';
                            $table .= '<input type="hidden" name="PILOTE" value="'.$r['PILOTE'].'">';
                            $table .= '<input type="hidden" name="JAN PREV" value="'.$r['JAN_PREV'].'">';
                            $table .= '<input type="hidden" name="JAN REAL" value="'.$r['JAN_REAL'].'">';
                            $table .= '<input type="hidden" name="FEV PREV" value="'.$r['FEV_PREV'].'">';
                            $table .= '<input type="hidden" name="FEV REAL" value="'.$r['FEV_REAL'].'">';
                            $table .= '<input type="hidden" name="MAR PREV" value="'.$r['MAR_PREV'].'">';
                            $table .= '<input type="hidden" name="MAR REAL" value="'.$r['MAR_REAL'].'">';
                            $table .= '<input type="hidden" name="ABR PREV" value="'.$r['ABR_PREV'].'">';
                            $table .= '<input type="hidden" name="ABR REAL" value="'.$r['ABR_REAL'].'">';
                            $table .= '<input type="hidden" name="MAI PREV" value="'.$r['MAI_PREV'].'">';
                            $table .= '<input type="hidden" name="MAI REAL" value="'.$r['MAI_REAL'].'">';
                            $table .= '<input type="hidden" name="JUN PREV" value="'.$r['JUN_PREV'].'">';
                            $table .= '<input type="hidden" name="JUN REAL" value="'.$r['JUN_REAL'].'">';
                            $table .= '<input type="hidden" name="JUL PREV" value="'.$r['JUL_PREV'].'">';
                            $table .= '<input type="hidden" name="JUL REAL" value="'.$r['JUL_REAL'].'">';
                            $table .= '<input type="hidden" name="AGO PREV" value="'.$r['AGO_PREV'].'">';
                            $table .= '<input type="hidden" name="AGO REAL" value="'.$r['AGO_REAL'].'">';
                            $table .= '<input type="hidden" name="SET PREV" value="'.$r['SET_PREV'].'">';
                            $table .= '<input type="hidden" name="SET REAL" value="'.$r['SET_REAL'].'">';
                            $table .= '<input type="hidden" name="OUT PREV" value="'.$r['OUT_PREV'].'">';
                            $table .= '<input type="hidden" name="OUT REAL" value="'.$r['OUT_REAL'].'">';
                            $table .= '<input type="hidden" name="NOV PREV" value="'.$r['NOV_PREV'].'">';
                            $table .= '<input type="hidden" name="NOV REAL" value="'.$r['NOV_REAL'].'">';
                            $table .= '<input type="hidden" name="DEZ PREV" value="'.$r['DEZ_PREV'].'">';
                            $table .= '<input type="hidden" name="DEZ REAL" value="'.$r['DEZ_REAL'].'">';
                            $table .= '<button class="btn btn-primary"><i class="fa fa-calendar-o" aria-hidden="true"></i></i> Editar </i></button>'; //
                            $table .= '</form></td>';



                            //MODAL COM O GRÁFICO
                            $table .= '<td><form action="graf-qualite.php" method="post">'; 
                            $table .= '<input type="hidden" name="ID" value="'.$r['ID'].'">';
                            $table .= '<input type="hidden" name="KPI" value="'.$r['KPI'].'">';
                            $table .= '<input type="hidden" name="PILOTE" value="'.$r['PILOTE'].'">';
                            $table .= '<input type="hidden" name="JAN PREV" value="'.$r['JAN PREV'].'">';
                            $table .= '<input type="hidden" name="JAN REAL" value="'.$r['JAN REAL'].'">';
                            $table .= '<input type="hidden" name="FEV PREV" value="'.$r['FEV PREV'].'">';
                            $table .= '<input type="hidden" name="FEV REAL" value="'.$r['FEV REAL'].'">';
                            $table .= '<input type="hidden" name="MAR PREV" value="'.$r['MAR PREV'].'">';
                            $table .= '<input type="hidden" name="MAR REAL" value="'.$r['MAR REAL'].'">';
                            $table .= '<input type="hidden" name="ABR PREV" value="'.$r['ABR PREV'].'">';
                            $table .= '<input type="hidden" name="ABR REAL" value="'.$r['ABR REAL'].'">';
                            $table .= '<input type="hidden" name="MAI PREV" value="'.$r['MAI PREV'].'">';
                            $table .= '<input type="hidden" name="MAI REAL" value="'.$r['MAI REAL'].'">';
                            $table .= '<input type="hidden" name="JUN PREV" value="'.$r['JUN PREV'].'">';
                            $table .= '<input type="hidden" name="JUN REAL" value="'.$r['JUN REAL'].'">';
                            $table .= '<input type="hidden" name="JUL PREV" value="'.$r['JUL PREV'].'">';
                            $table .= '<input type="hidden" name="JUL REAL" value="'.$r['JUL REAL'].'">';
                            $table .= '<input type="hidden" name="AGO PREV" value="'.$r['AGO PREV'].'">';
                            $table .= '<input type="hidden" name="AGO REAL" value="'.$r['AGO REAL'].'">';
                            $table .= '<input type="hidden" name="SET PREV" value="'.$r['SET PREV'].'">';
                            $table .= '<input type="hidden" name="SET REAL" value="'.$r['SET REAL'].'">';
                            $table .= '<input type="hidden" name="OUT PREV" value="'.$r['OUT PREV'].'">';
                            $table .= '<input type="hidden" name="OUT REAL" value="'.$r['OUT REAL'].'">';
                            $table .= '<input type="hidden" name="NOV PREV" value="'.$r['NOV PREV'].'">';
                            $table .= '<input type="hidden" name="NOV REAL" value="'.$r['NOV REAL'].'">';
                            $table .= '<input type="hidden" name="DEZ PREV" value="'.$r['DEZ PREV'].'">';
                            $table .= '<input type="hidden" name="DEZ REAL" value="'.$r['DEZ REAL'].'">';
                            $table .= '<!-- Button -->
                                        <button type="button" class="btn btn-danger button" data-toggle="modal" data-target="#exampleModal" name="button" onclick="abreModal(' . $r['ID'] .');">
                                          Gráfico
                                        </button>

                                        <!-- Modal -->

                                        <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true" onload="click("button");">
                                          <div class="modal-dialog" role="document">
                                            <div class="modal-content">
                                              <div class="modal-header">
                                                <h5 class="modal-title" id="exampleModalLabel">Gráfico</h5>
                                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                  <span aria-hidden="true">&times;</span>
                                                </button>
                                                </div>
                                                <div class="modal-body">


                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                                                </div>
                                            </div>
                                          </div>
                                        </div>'; //
                            $table .= '</form></td>';

                        }

                        //Finalizando a tabela
                        $table .= '</tbody></table>';


                        //Imprimindo a tabela
                        echo '<div class="table-table" style="overflow-x:auto;">';
                        echo $table;
                ?>

                </div>
            </div>
            <div class="col-sm-4 col-sm-offset-1">
                <!--<img class="img-responsive" src="img/640x380/01.jpg" alt="Our Office">-->
            </div>
        </div>
    </div>

As you can see, the ID is taken from the clicked button and then the graph is generated from that ID. The modal comes only after the graph generation.

php javascript ajax highcharts

asked by anonymous 11.06.2018 / 13:53

1 answer

Insert into the database a value of type date [duplicate] Mvc dbSetReserve does not contain a definition for getAll ()

score 0 · Accepted Answer

I solved the problem by making an Ajax page for the graphics page:

<?php 
error_reporting(E_ALL);
ini_set('display_errors', 1);

include("conn.php");

    if(isset($_POST['id']))
    {

        $id = $_POST['id'];

        $PREV = mysqli_query($lnk, "Select JAN_PREV, FEV_PREV, MAR_PREV, ABR_PREV, MAI_PREV, JUN_PREV, JUL_PREV, AGO_PREV, SET_PREV, OUT_PREV, NOV_PREV, DEZ_PREV from qualite where ID = ". $id . "");
        $REAL = mysqli_query($lnk, "Select JAN_REAL, FEV_REAL, MAR_REAL, ABR_REAL, MAI_REAL, JUN_REAL, JUL_REAL, AGO_REAL, SET_REAL, OUT_REAL, NOV_REAL, DEZ_REAL from qualite where ID = ". $id ."");


        $resultPREV = mysqli_fetch_assoc($PREV);

        $resultREAL = mysqli_fetch_assoc($REAL);

            $ListaP = $resultPREV; 
            $ListaR = $resultREAL; 
            $ListaPTotal = array();
            $ListaRTotal = array();

            foreach ($ListaP as $i => $value) {
                array_push($ListaPTotal, $value);
            }

            foreach ($ListaR as $i => $value) {
                array_push($ListaRTotal, $value);
            }


    }   

    $html2 = "
     <div id='container-tt' style='min-width: 310px; height: 400px; margin: 0 auto'></div>

        <script type='text/javascript'>
    Highcharts.chart('container-tt', {
    chart: {
        type: 'column'
    },
    title: {
        text: 'OBEYA DOPM 2018'
    },
    xAxis: {
        categories: [
            'Jan',
            'Feb',
            'Mar',
            'Apr',
            'May',
            'Jun',
            'Jul',
            'Aug',
            'Sep',
            'Oct',
            'Nov',
            'Dec'
        ],
        crosshair: true
    },
    yAxis: {
        min: 0,
        title: {

        }
    },
    tooltip: {

        shared: true,
        useHTML: true
    },
    plotOptions: {
        column: {
            pointPadding: 0.2,
            borderWidth: 0
        }
    },
    series: [{
        name: 'Previsto',
        data: [" . join(", ", $ListaPTotal) . "]

    }, {
        name: 'Realizado',
        data: [" .  join(", ", $ListaRTotal) . "]

    }]
});
        </script>
        </div>";

    echo $html2;

    //erro no php
?>