Click to See Complete Forum and Search --> : Toggle bullet in table cell
fshea31
08-24-2003, 10:48 AM
Hello. I'm building a database of my music collection. I have a sortable table with five columns: artist, album, song, disc/track number, and playlist. On clicking a cell in the playlist column, I simply want to toggle between having a bullet in that cell and having it empty (for several reasons I don't want checklists). The thing is that I don't want to assign individual id's to each cell. The only code I want is basically the following:
<td id="playlist"><a href="javascript:toggleBullet();"></a></td>.
I guess the javascript needs to know that the only cell to execute the function in is the one that is currently being clicked in. But how might I set this up? Thanks a lot.
Charles
08-24-2003, 10:58 AM
<script type="text/javascript">
<!--
Array.prototype.next = function () {if (this.n == undefined || this.n >= this.length) this.n = 0; return this[this.n++]}
bullet = ['*', '\xa0']
// -->
</script>
<p> <span onclick="this.parentNode.firstChild.data = bullet.next()">toggle</span></p>
fshea31
08-24-2003, 01:26 PM
Thanks Charles, but that didn't do the trick. I'm using IE 5.5, so maybe that's part of the problem, but nothing's happening with that script.
fshea31
08-24-2003, 01:28 PM
I forgot to add that it mentions that this.parentNode.firstChild is not an object.
How about:
function SwapContents(e) {
if(navigator.userAgent.indexOf("MSIE")!=-1) {
if(event.srcElement.tagName=="TD" && event.srcElement.cellIndex==4) {
event.srcElement.innerHTML=(event.srcElement.innerHTML=="")? "" : "";
}
}
else {
if (e.target == "[object HTMLTableCellElement]" && e.target.cellIndex==4) {
e.target.innerHTML=(e.target.innerHTML=="")? "" : "";
}
}
}
<table onclick="SwapContents(event);" etc. >
fshea31
08-25-2003, 12:31 PM
Thanks Fang. That worked perfectly. One more thing, if anyone has time: how about then clearing all the bullets with a button? Thanks dudes.