Join the AMA (Ask Me Anything) with the Firefox leadership team to celebrate Firefox 20th anniversary and discuss Firefox’s future on Mozilla Connect. Mark your calendar on Thursday, November 14, 18:00 - 20:00 UTC!

This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

How do I get the displayed text of a label to change

  • 1 reply
  • 0 have this problem
  • 1 view
  • Last reply by cor-el

more options

Issue

I have another kind of problem with Firefox

Description

I have some code:

function ExpandCollapseAll(toggleElement) {

   var hideElement = "none";
   var showElement = "inline";
   var collapseAllImage = document.getElementById("collapseAllImage").getAttribute("src");
   var expandAllImage = document.getElementById("expandAllImage").getAttribute("src");
   var toggleAllLabel = document.getElementById("toggleAllLabel");
   var state = toggleElement.getAttribute("state");
   var collapseLabel = document.getElementById("collapseAllLabel").value;
   var expandLabel = document.getElementById("expandAllLabel").value;
   if(state  == "expanded")
   {
       toggleAllLabel.innerText = expandLabel;
       toggleElement.setAttribute("state", "collapsed");
       toggleElement.style.backgroundImage = "url(" + expandAllImage + ")";
   } else
   {
       toggleAllLabel.innerText = collapseLabel;
       toggleElement.setAttribute("state", "expanded");
       toggleElement.style.backgroundImage = "url(" + collapseAllImage + ")";
   }
   var elements = document.getElementsByTagName("div");
   for(var i = 0; i < elements.length; i++)
   {
       var elementClass = elements[i].getAttribute("class");
       var reg = new RegExp("^collapseableSection$|^collapseableSection\\s|\\scollapseableSection\\s|\\scollapseableSection$", "i");
       if(reg.test(elementClass))
       {
           if(state  == "expanded")
           {
               CollapseElement(elements[i]);
           } else
           {
               ExpandElement(elements[i]);
           }
       }
   } 

} This function gets called when a mouse click happens over the toggle element. The toggle element is a div which has a background-image, and the label I wish to change. As you can see, the div contains a state attribute that I use to decide which background-image and label to set. The background-image correctly gets changed/displayed when the div gets a click event. I have set alerts so I know that the innerText of the label is being set to the correct values. The problem is, the text being displayed never changes, EVER. This code works correctly for IE, Opera, and Safari. In each of those, the displayed text changes each time the div is clicked.



(Edited by Moderator: placed code in a CODE block - c)

This happened

Every time Firefox opened

The first time I opened the site

Troubleshooting information

 Application Basics
       Name
       Firefox
       Version
       3.6.3
       Profile Directory
         Open Containing Folder
       Installed Plugins
         about:plugins
       Build Configuration
         about:buildconfig
 Extensions
       Name
       Version
       Enabled
       ID
 Modified Preferences
     Name
     Value
       accessibility.browsewithcaret
       true
       accessibility.typeaheadfind.flashBar
       0
       browser.history_expire_days.mirror
       180
       browser.places.smartBookmarksVersion
       2
       browser.startup.homepage
       http://sharepoint/sites/uati/default.aspx
       browser.startup.homepage_override.mstone
       rv:1.9.2.3
       extensions.lastAppVersion
       3.6.3
       network.cookie.prefsMigrated
       true
       places.last_vacuum
       1274998179
       privacy.sanitize.migrateFx3Prefs
       true
       security.disable_button.openCertManager
       false

User Agent

Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; MS-RTC LM 8; InfoPath.3; .NET4.0C; .NET4.0E)

== Issue == I have another kind of problem with Firefox == Description == I have some code: <code>function ExpandCollapseAll(toggleElement) { var hideElement = "none"; var showElement = "inline"; var collapseAllImage = document.getElementById("collapseAllImage").getAttribute("src"); var expandAllImage = document.getElementById("expandAllImage").getAttribute("src"); var toggleAllLabel = document.getElementById("toggleAllLabel"); var state = toggleElement.getAttribute("state"); var collapseLabel = document.getElementById("collapseAllLabel").value; var expandLabel = document.getElementById("expandAllLabel").value; if(state == "expanded") { toggleAllLabel.innerText = expandLabel; toggleElement.setAttribute("state", "collapsed"); toggleElement.style.backgroundImage = "url(" + expandAllImage + ")"; } else { toggleAllLabel.innerText = collapseLabel; toggleElement.setAttribute("state", "expanded"); toggleElement.style.backgroundImage = "url(" + collapseAllImage + ")"; } var elements = document.getElementsByTagName("div"); for(var i = 0; i < elements.length; i++) { var elementClass = elements[i].getAttribute("class"); var reg = new RegExp("^collapseableSection$|^collapseableSection\\s|\\scollapseableSection\\s|\\scollapseableSection$", "i"); if(reg.test(elementClass)) { if(state == "expanded") { CollapseElement(elements[i]); } else { ExpandElement(elements[i]); } } } } </code> This function gets called when a mouse click happens over the toggle element. The toggle element is a div which has a background-image, and the label I wish to change. As you can see, the div contains a state attribute that I use to decide which background-image and label to set. The background-image correctly gets changed/displayed when the div gets a click event. I have set alerts so I know that the innerText of the label is being set to the correct values. The problem is, the text being displayed never changes, EVER. This code works correctly for IE, Opera, and Safari. In each of those, the displayed text changes each time the div is clicked. <br/> <br/>''(Edited by Moderator: placed code in a CODE block - c)''<br/> <br/> == This happened == Every time Firefox opened == The first time I opened the site == == Troubleshooting information == Application Basics Name Firefox Version 3.6.3 Profile Directory Open Containing Folder Installed Plugins about:plugins Build Configuration about:buildconfig Extensions Name Version Enabled ID Modified Preferences Name Value accessibility.browsewithcaret true accessibility.typeaheadfind.flashBar 0 browser.history_expire_days.mirror 180 browser.places.smartBookmarksVersion 2 browser.startup.homepage http://sharepoint/sites/uati/default.aspx browser.startup.homepage_override.mstone rv:1.9.2.3 extensions.lastAppVersion 3.6.3 network.cookie.prefsMigrated true places.last_vacuum 1274998179 privacy.sanitize.migrateFx3Prefs true security.disable_button.openCertManager false == User Agent == Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; MS-RTC LM 8; InfoPath.3; .NET4.0C; .NET4.0E)

All Replies (1)

more options

A good place to ask questions and advice about web development is at the MozillaZine Web Development/Standards Evangelism forum. The helpers at that forum are more knowledgeable about web development issues. You need to register at the MozillaZine forum site in order to post at that forum.

See http://forums.mozillazine.org/viewforum.php?f=25