Adding php loop data to js array

Question

I have a php loop that loops through products and their data:

<?php foreach ($this->products as $product) { ?>

<script type=text/javascript>
product = {
    id:   $product->virtuemart_product_id,
    name: $product->product_name
};
</script>

<?php } ?>

The data contains information about the product un the $product like so:

• $product->virtuemart_product_id
• $product->product_name

Is it possible to add the data to a existing javascript array or object in each of the loops? Basically it will add the data of the loop to the javascript array or product.

Any help would be appreciated :)

Answer 1

There is a more better and clean way, use json_encode
PHP

<?php
  $data = array();
  foreach( $this->products as $product ) {
    $data[] = array(
      "id"    =>  $product->virtuemart_product_id,
      "name"  =>  $product->product_name
    );
  }
?>

HTML

<script type=text/javascript>
  var product = <?php echo json_encode( $data ) ?>;
</script>

You can also use

var product = <?php echo json_encode( $product ) ?>;

So when you want to access the product with javascript, your code will be

<script type="text/javascript">
  for( i in product ) {
    console.log( product[i] );
  }
</script>

Answer 2

You can use json using the php function json_encode:

<script type='text/javascript'>
<?php
    $products = $this->products;
    $js_array = json_encode($products);
    echo "var products = ". $js_array . ";\n";
?>
</script>

Another way to do the same thing:

<script type="text/javascript">
    var products= <?php echo json_encode($products); ?>;
    for(var i=0;i<n;i++)
    {
        alert(products[i]);
    }
</script>

Answer 3

you mean like this?:

<script type=text/javascript>
  var x, productArray = [];
<?php foreach ($this->products as $product) { ?>

  x = {
      id:   <?php print $product->virtuemart_product_id; ?>,
      name: <?php print $product->product_name; ?>
  };

  productArray.push(x);

<?php } ?>
</script>

Answer 4

What about that:

<script type=text/javascript>
var products= array();
<?php foreach ($this->products as $product) { 
 echo "product.push({
            id:   $product->virtuemart_product_id,
            name: $product->product_name
        });" ;
?>
</script>

Answer 5

Instead of having a script tag inside your loop, build a PHP array containing id/name for each product then, outside the loop, use json_encode() on it. This is then given to your JavaScript.

Answer 6

Using .push() you can append elements to array like this:

var products = [{
    name: 'Product 1',
    id: 1
}, {
    name: 'Product 2',
    id: 2
}]

So, if you want to append element to products array from your loop:

products.push({
    id:    <?php echo $product->product_id; ?>,
    name: '<?php echo $product->product_name; ?>'
});

Answer 7

My solution:

<?php foreach ($this->products as $product) { ?>
    <script type=text/javascript>
        product = {
           id:   <?=json_encode($product->virtuemart_product_id)?>,
           name: <?=json_encode($product->product_name)?>
        };
    </script>
<?php } ?>