Question

I am using a JW video player and the way it is implemented for a single video is as below

<div id="myElement">Loading the player...</div>

<script type="text/javascript">


jwplayer("myElement").setup({
    file: "<?php echo $dbVideoFile; ?>"
});

</script>

</div>

No what I want to do is that I want to do is loop through each existing video and to display a jw video player for each video. Only problem is that it is not quite working, it is only display the jsplayer for one video, the other videos do not show anything but blank. What am I doing wrong below:

    <p>
<?php foreach ($arrVideoFile[$key] as $v) { ?>
<div id="myElement">Loading the player...

<script type="text/javascript">


jwplayer("myElement").setup({
    file: "<?php echo 'VideoFiles/'.$v; ?>"
});

</script>

</div>
<?php } ?>
</p>

Answer 1

id tag should be unic so JWPlayer is confused when calling #myElement

Try incrementing a value and dynamically rename “myElement-” + i

I didn’t get to test but that shoudl work:

  <p>
<?php 
$i = 0;
foreach ($arrVideoFile[$key] as $v) { ?>
<div id="myElement-<?php echo $i; ?>">Loading the player...

<script type="text/javascript">


jwplayer("myElement-<?php echo $i; ?>").setup({
    file: "<?php echo 'VideoFiles/'.$v; ?>"
});

<?php $i++; ?>
</script>

</div>
<?php } ?>
</p>