Solved

Why Am I Getting A JavaScript Error When Attempting Show-Hide Elements?

Posted on 2007-11-19
11
892 Views
Last Modified: 2013-11-19
I have recently upgraded fro DW8 to CS3, and I am getting the following error in Dreamweaver when I attempt to add a "Show-Hide Element" from the "Behaviors" panel:

While executing onLoad in Show-Hide Layers.htm, the following Javascript error(s) occurred:

At line 145 of file "C:\Program Files\Adobe\Adobe Dreamweaver CS3\Configuration\Behaviors\Actions\Show-Hide Layers.js": TypeError: elem.tagName has no properties

A few notes:

(1)  The error only happens on pages on which I already have many show-hide elements events going on; the behavior works fine if I am adding the first show-hide or if the existing page only has a limited number of show-hides. The problem is I don;t want to have to re-do my pages with many show-hides from scratch; that's way, way too much work and would like to avoid if all possible
(2)  I have to click "OK" a couple of dozen times to get out of the error message above
(3)  I am very very good at Dreamweaver but not so great at Javascript which is why I list my knowledge level as "intermediate"

Here is the code for the .htm file referenced in the error message.  Below that is the code for the .js file.  I thank everyone in advance for any help.


.htm:
 

<!DOCTYPE HTML SYSTEM "-//Macromedia//DWExtension layout-engine 5.0//dialog">

<!-- SAFE-IN-TEMPLATES -->

<HTML>

<HEAD>

<SCRIPT SRC="Show-Hide Layers.js"></SCRIPT>

<SCRIPT SRC="../../Shared/Common/Scripts/dwscripts.js"></SCRIPT>

<SCRIPT SRC="../../Shared/MM/Scripts/CMN/DOM.js"></SCRIPT>

<SCRIPT SRC="../../Shared/MM/Scripts/CMN/menuItem.js"></SCRIPT>

<!-- Remove the following SCRIPT tag if you are modifying this file for your own use. -->

<SCRIPT SRC="../../Shared/MM/Scripts/CMN/displayHelp.js"></SCRIPT>

<!-- End removal area. -->

<SCRIPT LANGUAGE="javascript">

// Copyright 2000-2006 Adobe Macromedia Software LLC and its licensors. All rights reserved.
 

//--------------- LOCALIZEABLE GLOBALS---------------
 

var MSG_ElemenNotFound = 'The element "%s" that was set to %s could not be found.';

var MSG_ElementNoId = "Please select an element or click Cancel.";

var LABEL_SHOW = "show";

var LABEL_HIDE = "hide";

var LABEL_DEFAULT = "default";

//--------------- END LOCALIZEABLE   ---------------

//---------------    END JAVASCRIPT    ---------------

</SCRIPT>

<TITLE>Show-Hide Elements</TITLE>

<META HTTP-EQUIV="Content-Type" CONTENT="text/html">

<link href="../../fields.css" rel="stylesheet" type="text/css">

</HEAD>

<BODY onLoad="initializeUI()">

  <FORM NAME="theForm" ACTION="">

    <DIV ALIGN="center">

      

    <TABLE BORDER=0 cellpadding="4" cellspacing="2">

        <TR>

          

          <TD ALIGN="right" VALIGN="top" NOWRAP>

            Elements:</TD>

          <TD VALIGN="top" NOWRAP>

            <SELECT NAME="menu" SIZE=4 class="namedObjectsList">

              

            <OPTION SELECTED>**** no elements with ids found ********

            </select></TD>

        </TR><TR>

        </TR><TR>

          <TD></TD>

          <TD ALIGN="left" NOWRAP>

            <INPUT TYPE="button" VALUE="Show" onClick="storeVis(LABEL_SHOW);focus(this)">

            <INPUT TYPE="button" VALUE="Hide" onClick="storeVis(LABEL_HIDE);focus(this)">

            <INPUT TYPE="button" VALUE="Default" onClick="storeVis(LABEL_DEFAULT);focus(this)"></TD>

        </TR><TR>

          

        <TD NOWRAP>

        </TR>

      </TABLE>

    </DIV>
 

  </FORM>

</BODY>

</HTML>
 
 

And here is the .js:
 

// Copyright 1998-2006 Adobe Macromedia Software LLC and its licensors. All rights reserved.
 

//*************** GLOBAL VARS  *****************
 

var helpDoc = MM.HELP_behShowHideLayers;
 

//******************* BEHAVIOR FUNCTION **********************
 

// Shows and/or hides one or more elements at the same time.

// Accepts a variable number of argument pairs as follows:

//  objId    - the id of the element, such as "apDiv1". 

//  x        - ignored (for backward compatibility)

//  visStr   - 'visible', 'hidden', or 'inherit'.

//

// This function uses getElementById() to locate the element in the

// user's document.
 

function MM_showHideLayers() { //v9.0

  var i,p,v,obj,args=MM_showHideLayers.arguments;

  for (i=0; i<(args.length-2); i+=3) 

  with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];

    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }

    obj.visibility=v; }

}
 

MM.VERSION_MM_showHideLayers = 9.0; //define latest version number for behavior inspector
 

//******************* API **********************
 
 

// Checks for the existence of elements with an id attribute.

// If none exist, returns false so this Action is grayed out.

function canAcceptBehavior(){

  var retVal = false;

  var idArray = new Array();

  var dom = dw.getDocumentDOM();

  if (dom){

    idArray = dom.getElementsByAttributeName("id");

    if (idArray && idArray.length > 0)

      retVal = true;

  }

  return retVal;

}
 
 

// Returns a Javascript function to be inserted in HTML head

// with script tags.

function behaviorFunction(){

  return "MM_showHideLayers";

}
 
 

// Returns the function call to insert in HTML tag 

// <tag... onEvent='thisFn(arg)'>.

// Gets the list of elements with ids and their visibilities

// from a property set on the document object.

function applyBehavior() {

  // Get the global list of visibilities

  var visArray = document.MM_visArray;

  // Initialize the argument list and return value

  var argList = "", retVal = "";
 

  // Declare local variables

  var theVis, elemId;
 

  for (var i=0; i < visArray.length; i++){

    theVis = visArray[i];

    if (theVis){

      theVis = (theVis == LABEL_DEFAULT)? "inherit" : ((theVis == LABEL_SHOW) ? "show" : "hide");
 

      // Get the corresponding element's id

      elemId = document.ELEMENT_REFS[i].getAttribute("id");
 

      // If the argList is not empty, append a comma.

      if (argList) argList += ",";
 

      // Second argument is empty string (for backwards

      // compatibility).

      argList += "'" + elemId + "','','" + theVis + "'";

    }

  }

  if (argList) {

    updateBehaviorFns("MM_showHideLayers");

    retVal = "MM_showHideLayers(" + argList + ")";

  } else {

    retVal = MSG_ElementNoId;

  }

  return retVal;

}
 

// Given the original function call, this parses out the arguments and 

// updates the UI. First it gets new element,vis pairs.

// If the element already exists in the menu, put the vis value in visArray.

// If the element doesn't exist, add it to the menu and extend visArray.

function inspectBehavior(upStr){

  // Extract the arguments from the function call.

  var argArray = dwscripts.extractArgs(upStr);
 

  // Get the previous list of elements and their visibility settings.

  var visArray = document.MM_visArray; 
 

  // The number of elements with ids

  var numElements = document.ELEMENT_REFS.length;
 

  // Declare loop variables

  var elementId, theVis, found;
 

  // The first element in the argArray is the function name,

  // so scan elements starting at 1.

  for (var i=1; i < (argArray.length-2); i+=3){

    elementId = argArray[i];

    theVis = argArray[i+2];

    theVis = (theVis == "inherit")? LABEL_DEFAULT : ((theVis == "show") ? LABEL_SHOW : LABEL_HIDE);

    

    // Now check whether the element is already in the list

    found = false;

    for (var j = 0; j < numElements; j++){

      if (elementId == document.ELEMENT_REFS[j].getAttribute("id")){

        visArray[j] = theVis;

        addValueToMenuItem(document.theForm.menu,j,theVis);

        found = true;

        break;

      }

    }

    if (!found) alert(errMsg(MSG_ElementNotFound,elementId,theVis));

  }

  document.MM_visArray = visArray; //save updated layer list

}
 
 
 

//***************** LOCAL FUNCTIONS  ******************
 
 

// Load the select menu with element ids.

// Also sets the global property MM_visArray to the right num of items.
 

function initializeUI(){

  var dom = dw.getDocumentDOM();

  var elementArray = dom.getElementsByAttributeName("id");

  var displayNames = new Array();

  

  for (var i=0; i < elementArray.length; i++){

    var elem = elementArray[i];

    displayNames.push(elem.tagName.toLowerCase() + ' "' + elem.getAttribute("id") + '"');

  }
 

  visArray = new Array(); 

  for (var i=0; i < displayNames.length; i++) {

    document.theForm.menu.options[i] = new Option(displayNames[i]); //load menu

    visArray[i] = "";

  }

  //set globals

  document.MM_visArray = visArray;

  document.ELEMENT_REFS = elementArray;

}
 
 

// Stores the new visibility for the selected element in 

// in the global document property "MM_visArray" when the

// user clicks one of the visibility buttons in the UI.

function storeVis(newVis){

  // Get the existing visibilities.

  var visArray = document.MM_visArray; 

  

  if (visArray){

    // Get the position of the selected element

    var currElement = document.theForm.menu.selectedIndex;

    

    // Get the old visibility of the selected element

    var oldVis = visArray[currElement];

    

    // If the visibility is changing, store the new visibility

    // in the global MM_visArray and update the list/menu.

    if (oldVis != newVis) {

      visArray[currElement] = newVis;

      document.MM_visArray = visArray;

      addValueToMenuItem(document.theForm.menu, currElement, newVis);
 

      // Reset the selection after updating.

      document.theForm.menu.selectedIndex = currElement;
 

    }

    // If the new visibility is the same as the old, toggle it

    // (i.e., remove any visibility setting).

    else { 

      visArray[currElement] = ""; 

      document.MM_visArray = visArray;

      addValueToMenuItem(document.theForm.menu, currElement, ""); 

      document.theForm.menu.selectedIndex = currElement;

    }

  }

}

Open in new window

0
Comment
Question by:tomstraw
  • 4
  • 3
  • 2
  • +1
11 Comments
 
LVL 25

Expert Comment

by:James Rodgers
ID: 20313771
cant test properly as i dont have tehse scripts
<SCRIPT SRC="Show-Hide Layers.js"></SCRIPT>
<SCRIPT SRC="../../Shared/Common/Scripts/dwscripts.js"></SCRIPT>
<SCRIPT SRC="../../Shared/MM/Scripts/CMN/DOM.js"></SCRIPT>
<SCRIPT SRC="../../Shared/MM/Scripts/CMN/menuItem.js"></SCRIPT>
<!-- Remove the following SCRIPT tag if you are modifying this file for your own use. -->
<SCRIPT SRC="../../Shared/MM/Scripts/CMN/displayHelp.js"></SCRIPT>

can you provide a site link, absolute path
0
 
LVL 14

Expert Comment

by:B_Dorsey
ID: 20314238
no chance you have two attributes with the same id name on the page? regenerated the same data twice?

Just trying to weed out the possbilities
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 20314487
Hi tomstraw,

If the errors in CS3 occur on pages that originally used the DW 8 show-hide behavior then you are running into a compatibility error between the old javascript file and the new one CS3 expects to see/use.  You might have to reapply the effect to resolve it.
0
 

Author Comment

by:tomstraw
ID: 20314733
Thanks for the responses.  I'll take them one at a time:

Jester 48, I'm somewhat embarrassed to admit that I don't know quite where DW is putting those files on my web server; I can definitely say it's not anywhere I can see after I FTP in.  The address of my website is http://www.commuteinfo.org, and I imagine that the path after that would be along the lines of \configuration\Shared\Common\Scripts as it is locally, but I am pretty sure DW is probably creating a server-side directory with a name I am just not aware of, and I can't FTP at a dir level high enough (it appears) to see.  Any suggestions?  Or, if you want me to just copy-paste the local versions I have of those files, I will.

B Dorsey, I am pretty sure I don't duplicate IDs, but I will triple-check after sending this.

jason1178, I definitely HOPE that that isn't the case, because it would be a huge amount of work for me!  Even so, if I knew with absolute certainty there were no other way to do it, I would bite the bullet and just re-do everything from scratch, but I would hate to "do the re-do" and find out a day later that all I needed to do was swap a .js file or something!
0
 

Author Comment

by:tomstraw
ID: 20314741
Thanks, b0lsc0tt.  My bad on that.  I will definitely use the windows in subsequent messages
0
Top 6 Sources for Identifying Threat Actor TTPs

Understanding your enemy is essential. These six sources will help you identify the most popular threat actor tactics, techniques, and procedures (TTPs).

 
LVL 70

Accepted Solution

by:
Jason C. Levine earned 250 total points
ID: 20314855
I misspoke slightly.

The problem isn't with the js file (one just replaces the other) as much as the way Dreamweaver structures the HTML to call the js file.  If you compare a working page with a page that generates errors do you see any differences in the way the calls are structured?

If so, you might be able to fix things using a regex find and replace instead of a complete rebuild.
0
 
LVL 25

Expert Comment

by:James Rodgers
ID: 20314980
in the js function
function initializeUI()

add an alert to the process to see what is being generated

in this block
for (var i=0; i < elementArray.length; i++){
    var elem = elementArray[i];
    displayNames.push(elem.tagName.toLowerCase() + ' "' + elem.getAttribute("id") + '"');
  }

add the alert just after the second line

for (var i=0; i < elementArray.length; i++){
    var elem = elementArray[i];
if(i <=1){
alert(elem);
}    
displayNames.push(elem.tagName.toLowerCase() + ' "' + elem.getAttribute("id") + '"');
  }

the alert should say [object]
0
 

Author Comment

by:tomstraw
ID: 20315268
hmmm . . . I think I (we) figured it out . . . jason1178 got me thinking just about versions and it does appear that DW was trying to insert all-new code for the behavior into the head tag.  The code for the latest version is indeed different from that for DW8.  It's commented below as "Version 6" but I had been using this code in versions 7 & 8 as well.  The old code is below, followed by the new code.  It does appear that simply swapping these out in the head tag solves the problem, without having to do anything else.

One small--and not very important, for practical purposes--mystery remains, however:  I don't know why DW refused to swap out this code automatically on some pages while doing it just fine on others (especially those with not a lot of existing show-hide behaviors).  But, being more of a designer than a programmer, I am just happy when things work and don't try to rock the boat too much beyond that!
function MM_showHideLayers() { //v6.0
 

  var i,p,v,obj,args=MM_showHideLayers.arguments;
 

  for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
 

    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
 

    obj.visibility=v; }
 

}
 
 
 

function MM_showHideLayers() { //v9.0

  var i,p,v,obj,args=MM_showHideLayers.arguments;

  for (i=0; i<(args.length-2); i+=3) 

  with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];

    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }

    obj.visibility=v; }

}

Open in new window

0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 20315296
Adobe has been terrible about supporting the older versions of coding in Dreamweaver.  Going from MX to 8 and then from 8 to CS3 caused a week or two of figuring out what got changed and didn't get changed and applying fixes.

Glad I got you going in the right direction...
0
 

Author Comment

by:tomstraw
ID: 20315327
I hope I don't run into too many other glitches like this!  And even as far as that goes, a more comprehensible error mesage from the program would have done the trick.  "Can't insert code into head tag" or something along those lines would have tipped me off to this a lot quicker . . . but oh well.  That's exactly why I use Experts Exchange! Thanks again for the help!
0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
The viewer will learn how to count occurrences of each item in an array.
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

743 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now