using php in js function (external .js file)

bzc0fq :

I have a jakosc-powietrza.js file containing functions like this:

var combo1 = document.getElementById('S0_Data');
function test() {
    var dzien = combo1.value.trim();
    alert("Wybrano " + dzien);
 };
function render_test() {
    var test1 = <?php echo x; ?>;

    var chart = new CanvasJS.Chart("chartContainer", {
            theme: "light2",
            animationEnabled: true,
            title: {
                text: "Pomiar parametrÃ³w powietrza",
                fontSize: 25
                    },
            axisX: {
                title: "Czas",
                titleFontSize: 15,
                labelAngle: -90,
                intervalType: "hour",
                interval:55
                   },
            axisY: {
                title: "oC/%",
                titleFontSize: 15
                   },
            axisY2: {
                title: "ppm/ppb",
                titleFontSize: 15
                   },
            data: [
                  {
                type: "line",
                color: "red",
                name: "Temperatura",
                showInLegend: true,
                dataPoints: <?php echo json_encode($data_points, JSON_NUMERIC_CHECK); ?>
                  },
                  {
                type: "line",
                color: "green",
                name: "WilgotnoÅ›Ä‡",
                showInLegend: true,
                dataPoints: <?php echo json_encode($data_points2, JSON_NUMERIC_CHECK); ?>
                  },
                  {
                type: "line",
                color: "blue",
                name: "eCO2",
                axisYType: "secondary",
                showInLegend: true,
                dataPoints: <?php echo json_encode($data_points3, JSON_NUMERIC_CHECK); ?>
                  },
                  {
                type: "line",
                color: "yellow",
                name: "TVOC",
                axisYType: "secondary",
                showInLegend: true,
                dataPoints: <?php echo json_encode($data_points4, JSON_NUMERIC_CHECK); ?>
                  }
                  ]
        });
        chart.render();
};
combo1.addEventListener('change', render_test, false);

I include it into test.php file like this:

<script type="text/javascript" src="js/jakosc-powietrza.js"></script>

When I open test.php file using browser I got the following error in web console:

SyntaxError: expected expression, got '<'

...and it points to this:

var test1 = <?php echo x; ?>;

Any pointers what I am doing wrong?

David :

It's possible to have PHP parse/interpret your .js files just like it does with .php files, but it's generally a bad idea. (And certainly no PHP installation would do it by default.)

Instead, put the value you want in your .php file before your external JavaScript executes, and just reference it in your external JavaScript. For example:

<script type="text/javascript">
    var test1 = <?php echo x; ?>;
</script>
<script type="text/javascript" src="js/jakosc-powietrza.js"></script>

As the complexity grows there are various ways to manage scope, treating the dynamic value(s) as a dependency to be injected into an otherwise self-contained (unit testable) JavaScript module. But the premise remains the same.

using php in js function (external .js file)

Guess you like