Populating an array of items and its values in java script by passing in an array from PHP

Question

<?php
$myarray = array();  

<script type="text/javascript">
    $(function(){
        $("#demo").grid({
            'genre' : 'All',
            'items' :
            [
                {
                    'title'         : 'A',
                    'description'   : 'qwerty',
                    'thumbnail'     : ['http://mypd.front.net/f4534.jpg'],
                    'large'         : ['http://mypd.front.net/f4534_large.jpg'],
                    'button_list'   :
                    [
                        { 'title':'Demo', 'url' : 'http://mypd.front.net/', 'new_window' : true }
                    ],
                    'tags'          : ['Movies']
                },
                {
                    'title'         : 'B',
                    'description'   : 'asdfg',
                    'thumbnail'     : ['http://mypd.front.net/f5534.jpg'],
                    'large'         : ['http://mypd.front.net/f5534_large.jpg'],
                    'button_list'   :
                    [
                        { 'title':'Demo', 'url' : 'http://mypd.front.net/', 'new_window' : true }
                    ],
                    'tags'          : ['Series']
                },
                ...
                ...
                ...
                {
                    'title'         : 'Z',
                    'description'   : 'poiyut',
                    'thumbnail'     : ['http://mypd.front.net/f6534.jpg'],
                    'large'         : ['http://mypd.front.net/f6534_large.jpg'],
                    'button_list'   :
                    [
                        { 'title':'Demo', 'url' : 'http://mypd.front.net/', 'new_window' : true }
                    ],
                    'tags'          : ['Movies', 'Series']
                }
            ]
        });
    });
</script>

This an embedded script in my legacy index.php.

Now what I wanted to do is to populate the data inside the array of items(like title, description, etc.) by reading it from an array which I have in the php file.

Could you please let me know how I can do this?

Something like this is what I am looking for?

for ($i = 0; $i < sizeof($vodAssetArray); $i++)  
{  
   populate each of the items in the java script like   

     {
                    'title'         : $vodAssetArray[i]->title,
                    'description'   : $vodAssetArray[i]->description,
                    'thumbnail'     : [$vodAssetArray[i]->imgSrc],
                    'large'         : [$vodAssetArray[i]->imgSrc],
                    'button_list'   :
                    [
                        { 'title':'Demo', 'url' : 'http://mypd.front.net/', 'new_window' : true }
                    ],
                    'tags'          : [$vodAssetArray[i]->genre]
                },
}  

?>

numerous approaches here http://stackoverflow.com/questions/23740548/how-to-pass-variables-and-data-from-php-to-javascript — charlietfl, Dec 23 '14 at 20:30
If this is already on a PHP page, why not echo out the appropriate PHP that you need in their given locations? — Waxi, Dec 23 '14 at 20:30

score 1 · Answer 1 · answered Dec 23 '14 at 20:29

1

If the JavaScript is in your PHP file, you can simply echo the PHP variable. For example, if your PHP array was $array:

'title'         : "<?php echo $array['title']; ?>",

answered Dec 23 '14 at 20:29

versalle88

1,139
1
7
19

Did you mean &array[i]->title? – Navaneeth Sen Dec 23 '14 at 20:33
This was just a generic example. If you add the PHP array code to your question, I can tell you specifically for your case. – versalle88 Dec 23 '14 at 20:34
Can the whole script section be echo-ed using php. Because this code section will be inside ?> – Navaneeth Sen Dec 23 '14 at 20:52
@sen Yes, but it might look messy. ` ... ' ?>`. – Dec 23 '14 at 20:53
Can somebody help me echo this javascript with the for-loop for creating the array of items? – Navaneeth Sen Dec 23 '14 at 20:56
I donno how to echo the section inside the for-loop – Navaneeth Sen Dec 23 '14 at 20:57

score 1 · Accepted Answer · answered Dec 23 '14 at 20:57

Example

<?php
$vodAssetArray = array(
    array(
        'title'         =>'title 1',
        'description'   =>'description 1',
        'thumbnail'     =>'thumbnail imgSrc 1',
        'large'         =>'imgSrc 1',
        'genre'          =>'Tags 1',
    ),
    array(
        'title'         =>'title 2',
        'description'   =>'description 2',
        'thumbnail'     =>'thumbnail imgSrc 2',
        'large'         =>'imgSrc 2',
        'genre'          =>'Tags 2',
    )

);

$javascript= array();

$count = sizeof($vodAssetArray);
for($i = 0; $i < $count;  $i++)
{

$javascript[]=  "
{
                'title'         : ".$vodAssetArray[$i]['title'].",
                'description'   : ".$vodAssetArray[$i]['description'].",
                'thumbnail'     : [".$vodAssetArray[$i]['thumbnail']."],
                'large'         : [".$vodAssetArray[$i]['large']."],
                'button_list'   :
                [
                    { 'title':'Demo', 'url' : 'http://mypd.front.net/', 'new_window' : true }
                ],
                'tags'          : [".$vodAssetArray[$i]['genre']."]
 }
";

}
?>

<script type="text/javascript">
    $(function(){
        $("#demo").grid({
            'genre' : 'All',
            'items' :
            [
              <?php echo implode(',', $javascript); ?>
            ]
        });
    });
</script>

Populating an array of items and its values in java script by passing in an array from PHP

2 Answers2