Making web content disappear based on a passed db parameters
I had a task a few days ago where I wanted to make web content appear and disappear depending on some backend DB constraints.
So CSS/DHTML was the obvious choice!!
By setting "style.visibility " to either 'visible' or 'hidden' you can reveal or hide web content with ease.
so off I went and coded..........
I made the required div tags
<div id='$id'> around the content that I wanted to appear/disappear (where the
$id is from the DB).
On the onmouseover event of the tag, I fired off some javascript and attempted to hide the code with the following.
onmouseover="hide($id);"
Javascript:
function hide(id){
document.getElementById(id).style.visibility='hidden';
}
The idea was to fire off the javascript and hide the tag this way. The id being passed thru is id of the div tag
i.e.
<div id=$id>
Well...what do you know..... it would not work.
Javascript would see the id being passed thru as a good parameter, but as an integer, not the required string.
so I changed the code as follows.
I added the letters "tagid_" before the id in the div tag
i.e
<div id='tagid_$id'>
In the javascript I added the following
var this_id="tagid_"+id;
and then hide it as follows
document.getElementById(this_id).style.visibility='hidden';
And THIS worked like a dream..
PS!!... the code below was NOT run in a browser to check for validity.. it is only the idea.
Here is the basic sample code in full:
1. The div tags:
<div id='tagid_$id' >
2. The Onmouseover() event:
onmouseover="hide($id);"
3.The javascript read:
function hide(id){
var this_id="tagid_"+id;
document.getElementById(this_id).style.visibility='hidden';
}
And this seemed to work great.
Hope this helps someone out.
0 COMMENTS