Passing PHP variable to JwPlayer

Question

I'm looping the video URL from database and each video has a certain frame that I would like to "seek" to. I'm using the "seek" function provided from JwPlayer.

However, I can't seem to get it right on how to pass the variable to JwPlayer javascript. Below is my JS for JwPlayer:

$('.video').fancybox({
    content : '<div id="myElement">Loading the player...</div>',
    fitToView : true,
    afterShow : function() {
        this.content = jwplayer('myElement').setup({            
            flashplayer: "js/jwplayer.flash.swf",
            file: this.href,
            height: 360,
            width: 640,
            autoStart : false,
            stretching : "fill"
        }); 
        // Store references to tag and rates
        var videoTag;
        var currentRate = 1;

        jwplayer().onReady(function() {
            jwplayer().seek(<?=$sec?>);
        });
    }
});

And this is my HTML

<a class="video fancybox.iframe" href="<?=$video_link;?>">Watch Video</a>

Can anyone help to advise how I can put in the "sec" to jwplayer.seek? I tried using "id" and then get the ID but it's not working either.

Depending on what version of PHP you're using and what options you have enabled, you may not be able to use short tags (i.e. `=`). Try doing ``. What does it look like if you view the source in your browser? — Travesty3, Nov 05 '13 at 13:30
I can't put the =$sec?> there, it's just an indication the seek variable is there. The JS script is at the header, while the variables such as $video_link and $sec are obtained from a while loop. I need to pass the $sec to the JS so it can be used in the jwplayer — Sylph, Nov 05 '13 at 13:43
Also since the file for the player is a variable, you should set the player's type variable to mp4. — emaxsaun, Nov 05 '13 at 16:45

Travesty3 · Accepted Answer · 2013-11-05T14:24:47.560

2

If I understand correctly, it sounds like you have a number of those <a> tags, and you want each of them to indicate a different $sec value. If that's the case, you can try this:

<a onclick="seek(<?=$sec?>)" class="video fancybox.iframe" href="<?=$video_link?>">Watch Video</a>

And have a JS function like this:

function seek(sec) {
    jwplayer().onReady(function() {
        jwplayer.seek(sec);
    });
}

Or, if you are using HTML5, you can try a data attribute on your <a> tag:

<a data-sec="<?=sec?>" class="video fancybox.iframe" href="<?=$video_link?>">Watch Video</a>

And modify your JS to use it:

$('.video').fancybox({
    // ...
    afterShow: function() {
        // ...
        jwplayer().onReady(function() {
            jwplayer().seek($(this).data('sec'));
        });
    }
});

edited Nov 05 '13 at 14:24

answered Nov 05 '13 at 14:18

Travesty3

14,351
6
61
98

Thanks a lot for your help. I tried both method, but for method 1, the jwplayer onReady function will not trigger at all (I tried to put alert in there). So I use the method 2, but the data('sec') is not being passed over. Then I changed it to var linkvideo = document.getElementById('linkvideo'); var sec = linkvideo.getAttribute('sec'); alert(sec); and jwplayer().seek(sec); but the sec variable is blank. any advise? Thanks again – Sylph Nov 05 '13 at 23:18
Hi, I have managed to solved the issue. I created a new function and pass in the variable, together with the whole $(.video).fancybox() function then it works. Thank you very much for your help! – Sylph Nov 06 '13 at 00:25

Passing PHP variable to JwPlayer

1 Answers1