Changing Text

E

evanburen

I'm trying to text the text inside id="DirectorsCaption" within the
hideDirectors() and showDirectors() functions but it's not working. I'm
trying different variations using .innerHTML but with no luck so far.
Thanks.

<tr>
<td id="DirectorsCaption">ALL CURRENT AND RETIRED
DIRECTORS</td>
</tr>

<tr>
<td>
<input type="button" value="Current directors only"
onclick="hideDirectors();" />
<input type="button" value="All current and retired directors"
onclick="showDirectors();" />
</td>
</tr>


function hideDirectors( ) {
displayDirectors(false);
// document.getElementById("DirectorsCaption").innerHTML = "CURRENT
DIRECTORS";
document.all[DirectorsCaption].innerHTML = "CURRENT DIRECTORS";
}

function showDirectors( ) {
displayDirectors(true);
// document.getElementById("DirectorsCaption").innerHTML = "ALL
CURRENT AND RETIRED DIRECTORS";
document.all[DirectorsCaption].innerHTML = "ALL CURRENT AND RETIRED
DIRECTORS";
}
 
E

Evertjan.

I'm trying to text the text inside id="DirectorsCaption" within the
hideDirectors() and showDirectors() functions but it's not working. I'm
trying different variations using .innerHTML but with no luck so far.
Thanks.

<tr>
<td id="DirectorsCaption">ALL CURRENT AND RETIRED
DIRECTORS</td>
</tr>

<tr>
<td>
<input type="button" value="Current directors only"
onclick="hideDirectors();" />
<input type="button" value="All current and retired directors"
onclick="showDirectors();" />
Click to expand...

Why use buttons that are not doing anything? Only one is usefull at a
time!

</td>
</tr>


function hideDirectors( ) {
displayDirectors(false);
// document.getElementById("DirectorsCaption").innerHTML = "CURRENT
DIRECTORS";
Click to expand...

Choose for the more general: getElementById()

document.all[DirectorsCaption].innerHTML = "CURRENT DIRECTORS";
Click to expand...

Use css when needing only a specific hyding.
}

function showDirectors( ) {
displayDirectors(true);
// document.getElementById("DirectorsCaption").innerHTML = "ALL
CURRENT AND RETIRED DIRECTORS";
document.all[DirectorsCaption].innerHTML = "ALL CURRENT AND RETIRED
DIRECTORS";
}
Click to expand...

Try:

<tr><td>
ALL CURRENT
<span id='Retired'>AND RETIRED</span>
DIRECTORS
</td></tr>

<tr><td>
<input type='button'
value='Current directors only'
onclick='toggleRetired(this);'>
</td></tr>

...............

var Retired = document.getElementById('Retired')

function toggleRetired(x) {
if (x.value=='Current directors only'){
Retired.style.display = 'none';
x.value = 'Retired directors too';
} else {
Retired.style.display = '';
x.value = 'Current directors only';
}
}
 
R

Randy Webb

Evertjan. said the following on 3/10/2006 3:12 PM:

var Retired = document.getElementById('Retired')

function toggleRetired(x) {
Click to expand...

var Retired = document.getElementById('Retired');
if (x.value=='Current directors only'){
Retired.style.display = 'none';
x.value = 'Retired directors too';
} else {
Retired.style.display = '';
x.value = 'Current directors only';
}
}
Click to expand...

Firefox: Retired has no properties.
IE6: Line 12 Char 9 Object Expected.

Moving the Retired var declaration to inside the function removes the
errors. You can't set Retired equal to a reference to an element that
doesn't exist yet. Unless the script block is after the table. Move the
declaration, lose the Global variable, put the script block in the head
section with all the rest of the script blocks :)
 
E

evanburen

Thanks. I agree the one button approach is better but why isn't my code
working? Seems like this should work.

<tr>
<td>span id="DirectorsCaption">ALL CURRENT AND RETIRED
DIRECTORS</span></td>
</tr>

function hideDirectors( ) {
displayDirectors(false);
document.getElementById("DirectorsCaption").innerHTML = "CURRENT
DIRECTORS";
}

function showDirectors( ) {
displayDirectors(true);
document.getElementById("DirectorsCaption").innerHTML = "ALL CURRENT
AND RETIRED DIRECTORS";
}
 
E

Evertjan.

Randy Webb wrote on 10 mrt 2006 in comp.lang.javascript:
Evertjan. said the following on 3/10/2006 3:12 PM:

<snip>
Click to expand...

Not only snipped, you changed the position of my code!
var Retired = document.getElementById('Retired');


Firefox: Retired has no properties.
IE6: Line 12 Char 9 Object Expected.

Moving the Retired var declaration to inside the function removes the
errors. You can't set Retired equal to a reference to an element that
doesn't exist yet. Unless the script block is after the table. Move the
declaration, lose the Global variable, put the script block in the head
section with all the rest of the script blocks :)
Click to expand...

The

var Retired = document.getElementById('Retired')

was set BELOW the html elemnet, If you wnat it in the <head>,
you would have te run it in an <body onload function.

Setting the above inside the function is entirly possible, but not
educational, as repeatedly assichning the same should be discouraged.
 
T

Thomas 'PointedEars' Lahn

Thanks. I agree the one button approach is better but why isn't my code
working? Seems like this should work.

<tr>
<td>span id="DirectorsCaption">ALL CURRENT AND RETIRED ^[1]
DIRECTORS</span></td>
</tr>

function hideDirectors( ) {
displayDirectors(false); ^^^^^^^^^^^^^^^^^^^^^^^^[2]
document.getElementById("DirectorsCaption").innerHTML = "CURRENT
Click to expand...
[3]^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^[4]^^^^^^^^^[5] ^^^^^^^[6]
DIRECTORS";
}

function showDirectors( ) {
displayDirectors(true);
document.getElementById("DirectorsCaption").innerHTML = "ALL CURRENT
AND RETIRED DIRECTORS";
}
Click to expand...

There can be a number of reasons.

[^1] There is no `span' element, the start tag is missing.
[^2] Something goes wrong in displayDirectors().
[^3] document.getElementById() is not supported.

[^4] document.getElementById() does not return an object reference.
See also [1], and
<URL:http://www.jibbering.com/faq/faq_notes/not_browser_detect.html#bdFD>

[^5] `innerHTML' is not supported.
[^6] Your code is word-wrapped because it exceeds column 80 (or less),
hence there is a syntax error ("unterminated string literal").

<URL:http://jibbering.com/faq/#FAQ4_43>

BTW: Do not uppercase the text, let CSS do this for you
(text-transform:uppercase). And ISTM a `span' element is
not appropriate here either, this looks like a heading.


PointedEars
 
R

Randy Webb

Thomas 'PointedEars' Lahn said the following on 3/11/2006 5:28 PM:
Thanks. I agree the one button approach is better but why isn't my code
working? Seems like this should work.

<tr>
<td>span id="DirectorsCaption">ALL CURRENT AND RETIRED ^[1]
DIRECTORS</span></td>
</tr>

function hideDirectors( ) {
displayDirectors(false); ^^^^^^^^^^^^^^^^^^^^^^^^[2]
document.getElementById("DirectorsCaption").innerHTML = "CURRENT
Click to expand...
[3]^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^[4]^^^^^^^^^[5] ^^^^^^^[6]
DIRECTORS";
}

function showDirectors( ) {
displayDirectors(true);
document.getElementById("DirectorsCaption").innerHTML = "ALL CURRENT
AND RETIRED DIRECTORS";
}
Click to expand...

There can be a number of reasons.

[^1] There is no `span' element, the start tag is missing.
[^2] Something goes wrong in displayDirectors().
[^3] document.getElementById() is not supported.

[^4] document.getElementById() does not return an object reference.
See also [1], and
<URL:http://www.jibbering.com/faq/faq_notes/not_browser_detect.html#bdFD>

[^5] `innerHTML' is not supported.
[^6] Your code is word-wrapped because it exceeds column 80 (or less),
hence there is a syntax error ("unterminated string literal").
Click to expand...

7) None of the above.
8) The over use of footnotes.
<URL:http://jibbering.com/faq/#FAQ4_43>

BTW: Do not uppercase the text, let CSS do this for you
(text-transform:uppercase).
Click to expand...

Nonsense.
 
T

Thomas 'PointedEars' Lahn

Randy said:
Thomas 'PointedEars' Lahn said the following on 3/11/2006 5:28 PM:

Nonsense.
Click to expand...

Not everything you do not comprehend is nonsense. Of course
I did not mean not to use any uppercase character.


PointedEars
 
R

Randy Webb

Thomas 'PointedEars' Lahn said the following on 3/11/2006 7:53 PM:
Not everything you do not comprehend is nonsense.
Click to expand...

You fail to understand that I *do* comprehend it. Very well in fact.
Of course I did not mean not to use any uppercase character.
Click to expand...

The nonsense is letting CSS control it. What if CSS is not supported,
disabled, or doesn't support text-transform-uppercase?

CSS is a suggestion and if that suggestion is not followed? The best
course of action with letters and case is to simply type it the way you
want it to appear. Then, it will *always* appear that way.
 
M

Michael Winter

On 12/03/2006 05:59, Randy Webb wrote:

[Using CSS to present text in upper case]
The nonsense is letting CSS control it. What if CSS is not supported,
disabled, or doesn't support text-transform-uppercase?
Click to expand...

If case is purely presentational, as it was in the OP, then who cares if
CSS is disabled? The text will be shown in title case.

The content is "Current Directors". The desired presentation is "CURRENT
DIRECTORS". It really shouldn't matter which is the rendered result,
especially if that result is consistent.

Clearly, if the /content/ is upper-case ('HTML', for example) then CSS
shouldn't be used in that case.
CSS is a suggestion and if that suggestion is not followed?
Click to expand...

The document will render perfectly fine, and it will be just as readable
(arguably more so, in this instance).

[snip]

Mike
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Hiding Table Rows 1
Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
Script to send email not working 1
Javascript DOM 1
How can I calculate the last payment of the year to be the sum of all previous payments for that year and subtracting it from Research Costs value? 7
Sort by number of characters 1
Filter table rows based on multiple checkboxes value 2
Image not changing between "mute" & "un-mute" images. 5

Members online

Total: 46 (members: 1, guests: 45)
Robots: 72

Forum statistics

Threads
473,780
Messages
2,569,611
Members
45,277
Latest member
VytoKetoReview

Latest Threads

Top