Pass video url into Modal - Jquery

Asked

Viewed 1,051 times

0

I’m passing the url into the embed (#meuid) thus:

<script>
   $('#treinamentos').on('show.bs.modal', function (event) {
       var button = $(event.relatedTarget) 
       var nome   = button.data('nome') 
       var video  = button.data('video') 

       $('#nmTreinamento').text(nome);   
       $('#meuid').attr('src', 'https://www.youtube.com/watch?v=VaKvZzKyI1s');
    })
</script>

The modal with the embed takes the url but does not display the video:

 <div class="modal fade" id="treinamentos" tabindex="-1" role="dialog" aria-labelledby="alterarLabel" style="z-index: 1100;">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
             <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                 <h4 class="modal-title" id="exampleModalLabel">Deseja excluir o Treinamento ? </h4>
             </div>

             <div class="modal-body">

              <label for="nmTreinamento" id="nmTreinamento"></label>

             <embed id='meuid' 
             type="application/x-shockwave-flash" fs=1
             allowfullscreen="true" allowscriptaccess="always"
             width="940" height="440" align="center"></embed>               
            </div>                
         </div>
    </div>
</div>

There is a way to pass the url into the embed?

javascript jquery

  • Pass a js variable to one of php? That’s it?

  • @Guilhermelautert doesn’t answer that question

  • 1

    Bia, "PHP runs on the server side to create the page, and JS runs on the client side with the page already created. The only way they "talk" is via ajax." this in the answer of that question, ie you will have to implement an Ajax :D solution.

  • @Guilhermelautert I did not express myself well, I changed the question to explain what I really wish to do. Anyway thank you.

  • Bia, the signage is "possible duplicate". The correct procedure is to edit the question to show that it is not the case, ideally even including in your text "I read the double question and serves no such-and-such purpose"

  • @brasofilo informed before editing, but did not leave.

  • It is only because the question has 4 votes to close as duplicate and some unsuspecting that not reading the comments can give the final vote mistakenly...

Show 2 more comments

2 answers

2


You can use jquery itself. Put the id in the required tags, for example:

<embed id='meuid' src="https://www.youtube.com/v/<?=$video?>?version=3"
                 type="application/x-shockwave-flash" fs=1
                 allowfullscreen="true" allowscriptaccess="always"
                 width="940" height="440" align="center"></embed>

Use the function attr jquery to change the src property of the above tag.

$minhaurl = 'meu link formatado com o id aqui'
$('#meuid').attr('src', $minhaurl)

Any questions you may ask.

  • this way the video is not displayed

  • I was able to use what you gave me, just put the embed inside an Object and passed the value to that Object: $('#Object'). attr('value', 'https://www.youtube.com/v/url?version=3"') $('#embed'). attr('src', 'https://www.youtube.com/v/url?version=3"')

2

Following the documentation available on W3schools :

A built-in flash animation

That is to say I believe <embed> file support only .swf local.

About videos from Youtube

The solution I found was to <iframe>.

$('#meuid').attr('src', 'https://www.youtube.com/embed/VaKvZzKyI1s');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<iframe width="420" height="315" id="meuid">
</iframe>

Obs

Note that there is a change to be made :

www.youtube.com/watch?v=VaKvZzKyI1s
www.youtube.com/embed/VaKvZzKyI1s

For this you can do by replace:

function changeToEmbed(src){
    return src.replce('watch?v=', 'embed/');
}

  • your answer was also helpful, I used www.youtube.com/watch? v=Vakvzzkyi1s

Browser other questions tagged javascript jquery

You are not signed in. Login or sign up in order to post.