Export javascript when the script is using PHP variables

Question

I've got 800 lines of JS code inside a php script for a site, and littered throughout some of the JS functions are some PHP echos to insert variables from PHP. I want as much of the JS out of the page as possible, but I don't know any good way to do so, as I'm not very expirenced in JS, and since I didn't write the code I don't even know the reason for 100% of this stuff.

Here's an example of one of the worst offenders and one I have no idea how I'd convert out of the PHP page.

function validateCostCenter(el){
var objCB = el;
var emp_code = objCB.name.substring(23,29);
var local_plant_ID ="<?=$plant['Plant']['LocationID']?>";
var cc_plants_array = ["<?=$cc_plants?>"];
var CCPlant=false;
var CostCenterExists=false;
var std_cs_array = [];
<?
$idx = 0;
foreach($employees as $emp){
    foreach($std_cs as $cs){
        if($emp['Emp']['id'] == $cs[0]['emp_id']){
            echo "std_cs_array[".$idx."] = [\"".trim($emp['Emp']['code'])."\",\"".$cs['0']['emp_id']."\",\"".$cs['0']['locationid']."\",\"".$cs['0']['charge_back_plant_id']."\"];\n";
            $idx++;
        }
    }
}

?>

Would the best way to do this be to remove all the pure JS functions from the page and include them as an external file, and just leave the partly-php ones 100% as is? This is one of the most wasteful and slow pages we have on our site so I'd like it to be as optimized as possible, and separate java script files makes everything easier to debug.

There's no reason why the entire JS file cannot be generated by a PHP script. What you can try doing is moving ALL js into a separate file - and have that file bear .php extension. Inside that php, start with header('Content-type: text/javascript'); - now your entire js can be in a separate file. In the main file you'll have <script type='test/javascript' src='myjs.php'></script>. Of course, you'll need to sort out how the variables get populated. — Aleks G
– Aleks G, Commented Aug 15, 2011 at 13:55
Maybe you can get these variable contents as a seperate ajax request? — useraged
– useraged, Commented Aug 15, 2011 at 13:55
The reason I want them separate is I'm trying to minify the HTML output and it broke the JS; turns out the JS isn't 100% valid and isolating the issues is difficult as is, and generally I'd rather keep the site as modular as possible. It's also an extra 800+ lines the client could never cache, and this page is a performance issue. Making the separate page a "PHP" js file is an interesting approach and I'll see if I can make it work, though it doesn't fix the uncacheable issue. For now I'm trying to isolate the bits with no php code into a file. — Zelda
– Zelda, Commented Aug 15, 2011 at 14:30

Arnaud Le Blanc · Accepted Answer · 2011-08-15 14:08:15Z

1

Add all these php-generated variables as parameters of your function:

function validateCostCenter(el, local_plan_ID, cc_plants_array, std_cs_array)

BTW you could use json_encode to export your $employers array to javascript.

answered Aug 15, 2011 at 14:08

Arnaud Le Blanc

100k24 gold badges211 silver badges196 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jiri Kriz · Accepted Answer · 2011-08-15 15:35:50Z

I will illustrate possible approaches on a very simple example.

Approach 1: Computation in PHP

The page.php contains the computation and the generated Javascript file (as you have it now):

<body>       
<?php
function sum_php($a) {
    $sum = 0;
    for ($i = 0; $i < count($a); ++$i) $sum += $a[$i];
    return $sum;
}
$a = array(1, 2, 3);
$sum = sum_php($a);
?>

<script type="text/javascript">
    // JS generated by PHP:
    alert("sum_php=" + <?php echo $sum ?>);
</script>     
</body>

Approach 2: Computation in Javascript

The computation is moved out of PHP into a separate Javascript file page.js. PHP supplies the variables to the JS functions by JSON-encoding:

(1) page.php:

<head>     
    <script type="text/javascript" src="page.js"> </script>     
</head>     
<body>       
<?php
    $a = array(1, 2, 3);
?>    
<script type="text/javascript">
    sum_js(<?php echo json_encode($a) ?>); // supply $a to JS function
</script>     
</body>

(2) page.js:

function sum_js(a) {
    var s = 0;
    for (var i = 0; i < a.length; ++i) s += a[i];
    alert("sum_js=" + s);
    return s;
}

symcbean · Accepted Answer · 2011-08-15 15:16:30Z

Assumiong that these values are non-cacheable....

If it were me, I'd have a PHP create a global object/array to hold the values, and generate non-cacheable javascript file, then move the rest of the code into a static, cacheable file, e.g.

user_vars.php:

<?php
session_start();
....get values for variables....
print "user_vars={";
print "   '  plant': " . json_encode($plant) . "\n";
print "   ', cc_plants_array: [" . $cc_plants . "]\n";
....etc

generic.js:
function validateCostCenter(el){
 var objCB = el;
 var emp_code = objCB.name.substring(23,29);
 var local_plant_ID = user_var.Plant.LocationID;
 var cc_plants_array = user_var.cc_plants_array;
.....

However unpicking what the generated values for each parameter will be can be a bit tricky - the simplest approach might be to write a temporary file as PHP generates the base HTML rather than try to create the data structures twice.

Collectives™ on Stack Overflow

Export javascript when the script is using PHP variables

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related