0

I am a beginner as you can see. Would like to learn how to pass value from MySQL database into a Bootstrap chart module. I have basic knowledge in PHP but do not know how to work with PHP in a .JS file. Please refer me to a tutorial or another similar topic with answers. Thank you.

I tried to embed the PHP code section into the part 'data' of variable 'data', as you can see.

(function(window, document, $, undefined) {
'use strict';


$(initFlotLine)

function initFlotLine() {

    var data = [{
        "label": "Sales",
        "color": "#5ab1ef",
        "data": <?php echo json_encode($data); ?> // my silly attempt
    }, ];

    var options = {
        series: {
            lines: {
                show: true,
                fill: 0.01
            },
            points: {
                show: true,
                radius: 4
            }
        },
        grid: {
            borderColor: '#eee',
            borderWidth: 1,
            hoverable: true,
            backgroundColor: '#fcfcfc'
        },
        tooltip: true,
        tooltipOpts: {
            content: function(label, x, y) { return x + ' : ' + y; }
        },
        xaxis: {
            tickColor: '#eee',
            mode: 'categories'
        },
        yaxis: {
            // position: 'right' or 'left'
            tickColor: '#eee'
        },
        shadowSize: 0
    };

    var chart = $('.chart-line');
    if (chart.length)
        $.plot(chart, data, options);

}

})(window, document, window.jQuery);
lielielie
  • 1
  • 1
  • Whatever chart library you're using probably has a specific way to request remote data. You should check the docs. – Patrick Q Sep 18 '18 at 20:03
  • @PatrickQ The documentation offers no help. I think I am at the right spot to insert the PHP code section but do not have the knowledge to do so properly. – lielielie Sep 18 '18 at 20:14
  • 1
    If this is a complete *.js file then the server is sending it as-is, and will not run it through PHP first. A quick and dirty fix is to save the file as `myscript.php` instead, then use `` –  Sep 18 '18 at 20:15
  • @lielielie Another way is to simply insert the data in `index.php` above the script. `` –  Sep 18 '18 at 20:18
  • 3
    Possible duplicate of [How to pass variables and data from PHP to JavaScript?](https://stackoverflow.com/questions/23740548/how-to-pass-variables-and-data-from-php-to-javascript) –  Sep 18 '18 at 20:19
  • 4th link on the [Examples](https://www.flotcharts.org/flot/examples/) page. – Patrick Q Sep 18 '18 at 20:24

0 Answers0