How to add Dropdown selector for embedded videos

62 views
Skip to first unread message

Riley Bidondo

unread,
Apr 4, 2023, 2:12:14 PM4/4/23
to TiddlyWiki

As the title suggests, what I'm trying to accomplish is have a drop down with a list of videos. Once the user makes a selection the embedded video on the page changes to the video selected.

Example: https://prnt.sc/d8VElh0pr_NY

Example of the HTML I have working on a website I made, but want to transfer to TiddlyWiki. With <script> tags not working in TiddlyWiki, I'm not sure how to accomplish the same thing..

<optgroup label="Keypads"> <option value="SL4shuPWRnE">Arm/Disarm</option> <option value="HuzCY5OsznM">Cancel/Verify</option> <option value="gPOC3d29aAo">Door Chime</option>

Javascript from my website

<script> $("#dynamic_select").change(function(){ var val = $(this).val(); $("iframe").attr("src", function(i, a){ return a.replace(/(?<=embed\/)[^?]+/, val); }); console.log($("iframe").attr("src")); }); </script>

This then triggers this section of the HTML for the embed to change the embed YT video.

<iframe src="https://www.youtube.com/embed/SL4shuPWRnE?vq=hd1080 rel=0&amp;showinfo=0">

Any suggestions would be greatly appreciated.

Riley Bidondo

unread,
Apr 4, 2023, 3:12:39 PM4/4/23
to TiddlyWiki
Got it resolved! Thanks anyway!
Reply all
Reply to author
Forward
0 new messages