user1914374
user1914374

Reputation: 1260

How to display a video player in a loop

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>

Upvotes: 0

Views: 1561

Answers (1)

mika
mika

Reputation: 1451

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>

Upvotes: 2

Related Questions