Update charts when using dropdown item (custom dashboard)

[Iurywsl]

in my custom dashboard I have graphs (charts) powered by sql queries, and I have a dropdown with a period with dates (30,60,90 days). How can I make it so that when I change the date, the new sql query with my filter is automatically read by the graphics? I tried to use ajax to update, but the error.

[arbei]

You can see Chart.js docs on Updating Charts.

[Iurywsl]

the problem is not with the chart, the problem is getting the new query with the filter after changing the dropdown

//select dashboard medicas avaliacao normal
                $sql = "select avaliacao.data, avaliacao.peso, avaliacao.gordura_corporal, avaliacao.massa_muscular, avaliacao.massa_gorda, avaliacao.bmr_basal, avaliacao.agua_corporal FROM avaliacao WHERE avaliacao.id_usuario=" . CurrentUserId() . " " . $filtro_sql . " order BY avaliacao.data asc";
                $peso_grafico = ExecuteQuery($sql);
                $data = [];
                if ($peso_grafico->rowCount() > 0) { // check condition: if record count is greater than 0
                    while ($row = $peso_grafico->fetch()) { // begin of loop
                        $data[] = $row;
                    } // end of loop
                    // display the result
                } else { // if there are no result
                } // end of check condition
                foreach ($peso_grafico as $row) {
                    $data[] = $row;
                }

I need to run this query. but as I'm doing a javascript event(dropdown), I can't get the new "filter"($filtro_sql) variable in the php code.

[arbei]

Iurywsl wrote:

I tried to use ajax to update

If you use Ajax, you need to Create Your Own API Action, when the dropdown changes, get the new value, pass to your API action, in which you use the server side code you posted above to get the new data and return it as JSON. On the client side your JavaScript receieve the new data and update the chart.

[Iurywsl]

thanks for the tip.
but I've never used api action, I'm doing a test and it's giving an error. 404 (Not Found)

function Api_Action($app)
{
      $app->get('/hello/{name}', function ($request, $response, $args) {
        $name = $args["name"] ?? null; // Get the input value
        if ($name !== null) {
            $response = $response->write("Hello, " . $name); // Write to response
        }
        return $response; 
    });
}

``
<script>
$.get("/Hello/Chai", function (res) {
console.log(res); // Show the result in console
});
</script>

error. 404 (Not Found)

[Iurywsl]

I forgot to include the "api/", now is working. thanks