...

View Full Version : Problem calling a function, to hide/show comments



DrkInsanity
07-19-2009, 08:20 PM
So in the past I've mostly just copy and pasted other JavaScript functions I needed, and made slight modifications based on my exact needs. However, this time I couldn't find anything that would work with what I wanted to do (show and hide comments on news stories in a particular way), so I decided to just make my own.

After a few hours of messing around with it, I'm quite exasperated, because what I have looks like it should work, but for some reason I can't identify, doesn't.

Here's the function I'm trying to use:



<script language="javascript" type="text/javascript">
Function showComments(articleID) {

//Get all rows affected, based on tag congruent with articleID
var allRows = document.getElementByID(articleID).getElementsByTagName('tr');

//Run through all rows
For (var i = 0; i < allRows.length; i++) {

//show hidden comments
If (allRows[i].className == 'commenthide') {

allRows[i].className = 'commentshow';

}

//or, hide shown comments
Else If (allRows[i].className == 'commentshow') {

allRows[i].className = 'commenthide';

}
}

}
</script>


Essentially what it should do is, find the table with the ID of the news article whose comments are being toggled, then find all the rows in the table that are labeled as comments, and either show them or hide them, based on their current state (as defined by their class with a "display: none;" in it or not).

I have this link to call the function, then:



<a class=\"newsfooterL\" href=\"javascript:showComments('".$articleID."')\">show comments (".$numcomments.") [+]</a>


Obviously it uses PHP, but I know that's not the problem; it just uses the article's ID number to pass on which comments need to be hidden/shown to the function.

From everything I've looked up, this should work, but doesn't. Something peculiar, though, is that the function looks like it's not even being called; I put a simple alert('Test'); in the function, and still nothing happened when I clicked the link. So maybe my function is fine in itself, but I'm just calling it in an incorrect manner? I don't know, which is why I'm so exasperated.

If someone could please take a look and say what they think, even if it's just a basic thing as "Dude, you put a semicolon in the wrong place," I'd really appreciate it!

venegal
07-19-2009, 08:32 PM
"Dude, Javascript is case sensitive."

Replace Function, For, If and Else with function, for, if and else. That should at least get you started.

DrkInsanity
07-19-2009, 09:18 PM
Heh, well. I guess that's kind of what I wanted the problem to be, but also kind of not at the same time. More embarrassing.

I suppose I just never actually read that anywhere, and hadn't really noticed it was an essential part of JavaScript. Like I said, this is my first time actually creating a JavaScript function that wasn't 95% copy-paste.

Well that did get the function called at least, as my test alert started popping up, so thanks! However, the meat of the function still isn't working. I believe something's wrong with my "for" loop there.

Here's my new function, then:



<script language="javascript" type="text/javascript">
function showComments(articleID) {

//Get all comments affected, based on tag congruent with commentID/articleID
var allRows = document.getElementByID('articleID').getElementsByTagName('tr');

//Run through all rows
for (var i=0; i<allRows.length; i++) {

alert('Got to this point.');

//show hidden comments
if (allRows[i].className == 'commenthide') {

allRows[i].className = 'commentshow';

}

//or, hide shown comments
else if (allRows[i].className == 'commentshow') {

allRows[i].className = 'commenthide';

}
}

}
</script>


The alert in the "for" there isn't popping up, so I believe the problem's centered around there. The problem itself is probably something that I easily overlooked again in my ignorance, but I would appreciate any further suggestions if I don't get it working myself soon! Also thanks again for your protip, venegal.

venegal
07-19-2009, 09:42 PM
Same problem, it's getElementById, not getElementByID; I didn't notice that before.

DrkInsanity
07-20-2009, 05:05 AM
Well, I finally got it working! And it turned out to be only a number of small problems, with my core function actually being, for the most part, correct. As I kind of figured would turn out to be the case.

Thanks for your help, though even after changing all the casing, it still wasn't working. But it turned out to simply be that my variable wasn't being called correctly, as it was enclosed it in quotations, when it's apparently not supposed to be. Whoops.

Well, here is my final, working code, then:



<script language="javascript" type="text/javascript">
function showComments(articleID) {

//Get all comments affected, based on tag congruent with commentID/articleID
var allRows = document.getElementById(articleID).getElementsByTagName('tr')

//Set so as to only change the +/- expander once
var expandCheck = 0;

//Run through all rows
for (var i=0; i<allRows.length; i++) {

//show hidden comments
if (allRows[i].className == 'commenthide') {

allRows[i].className = 'commentshow';

//change +/- expander if necessary
if (expandCheck == 0) {

var expandID = "expand" + articleID;

document.getElementById(expandID).innerHTML = "&ndash;";

var expandCheck = 1;

}

}

//or, hide shown comments
else if (allRows[i].className == 'commentshow') {

allRows[i].className = 'commenthide';

//change +/- expander if necessary
if (expandCheck == 0) {

var expandID = "expand" + articleID;

document.getElementById(expandID).innerHTML = "+";

var expandCheck = 1;

}

}
}

}
</script>


The only major thing changed was the inclusion of another section of code that changes the [+] to a [-] after the comments are shown, and then back again when they are hidden. But thanks again venegal, even though all my problems turned out to be "Dude," ones, heh.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum