Databases
StackOverflow2013
Postsdbo
POdisplaying a series of youtube embeds that can be hidden/displayed
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POdisplaying a series of youtube embeds that can be hidden/displayed
    text
    copied!<p>My goal is to show a series of embedded youtube videos on one page but allowing the user to hide or show any youtube video by clicking a button associated with a specific youtube video on the page. I made a form that submits the youtube embed code to a mysql database and I created a php file to retrieve every embed code using a for loop. For each iteration of the for loop, a youtube video will pop up with a corresponding button which will allow the user to hide or show the youtube video.</p> <p>It works when there is only one entry in the mysql table but does not work when more youtube embed codes are uploaded. For example, when there are two youtube embed codes uploaded, two buttons are created, but when I click either of the two buttons, it will only show or hide the first youtube embed. None of the buttons will show the second youtube video.</p> <p>here is the code with some edits:</p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;hide/show iframe&lt;/title&gt; &lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/&gt; &lt;style type="text/css"&gt; &lt;!-- #frDocViewer { width:70%; height:50%; display:none; } --&gt; &lt;/style&gt; &lt;script type="text/javascript"&gt; &lt;!-- function HideFrame() { var fr = document.getElementById ("frDocViewer"); if(fr.style.display=="block") { fr.style.display="none"; } else { fr.style.display="block"; } } //--&gt; &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;?php mysql_connect ("","","") or die(mysql_error()); mysql_select_db ("") or die(mysql_error()); $lastid = mysql_query ("SELECT * FROM embed ORDER BY id DESC LIMIT 1"); $lastid = mysql_fetch_assoc($lastid); $lastid = $lastid['id']; for ($count=1; $count&lt;= $lastid ; $count++) { $iframe = mysql_query ("SELECT * FROM embed WHERE id=$count "); $iframe = mysql_fetch_assoc($iframe); $iframe = $iframe['url']; echo " &lt;image src='utube.gif' onclick='HideFrame()' /&gt; &lt;div id='frDocViewer'&gt; $iframe &lt;/div&gt; "; } ?&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload