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>&nbsp;<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.

Fang
08-24-2003, 02:54 PM
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.