www.webdeveloper.com
Results 1 to 7 of 7

Thread: [RESOLVED] display property error only in IE7

  1. #1
    Join Date
    Aug 2010
    Posts
    81

    resolved [RESOLVED] display property error only in IE7

    I have a page:
    http://www.girlscoutsmoheartland.org...progsearch.php
    that works perfectly fine in every browser I try, except for actual IE7 (it even works fine in IE8 emulating IE7).
    When you search for something on that page and have a display of results, each result has a link that changes a table row's display to visible, and hides the row when clicked again. It doesn't do that in IE7.
    There are no errors or warning in Firefox's Error Console. But IE7 has an "Error on Page" notice (which does NOT appear in IE8 emulating IE7), that says:

    Line: 59
    Char: 11
    Error: Could not get the display property. Invalid argument.

    The script in question is this, with what would be line 59 indicated:
    Code:
    <script type="text/javascript">
    <!--
        function toggle_visibility(id) {
           var e = document.getElementById(id);
           var f = document.getElementById(id + "b");
    	   
           if(e.style.display == 'table-row')
              e.style.display = 'none';
           else
              e.style.display = 'table-row'; <<-- This is line 59
    		  
           if(f.style.display == 'table-row')
              f.style.display = 'none';
           else
              f.style.display = 'table-row';
        }
    //-->
    </script>
    I really don't know what to do, or where to begin. Everything in my limited knowledge seems to be working just fine. Most of my site's visitors use IE8, but enough use actual IE7 that I really need to fix this.
    Thanks for any help or advice!
    Liam

  2. #2
    Join Date
    Aug 2007
    Posts
    3,767
    Have you definitely no name conflicts? No element with the same name as the id you are using for example.
    Great wit and madness are near allied, and fine a line their bounds divide.

  3. #3
    Join Date
    Mar 2010
    Posts
    2,803
    I use elements whose name and id are the same without any problems, so I doubt that is your problem.

    I suspect that IE7 does not support a value of 'table-row' for styles.

    Maybe try setting the value to an empty string which results in the display style being set to whatever the default value is for that type of element.

    Code:
     
    
    if(elemObject.style.display != 'none') {
           elemObject.style.display = 'none';
    } else {
           elemObject.style.display = '';
    }
    Last edited by tirna; 08-12-2010 at 05:33 PM.

  4. #4
    Join Date
    Aug 2010
    Posts
    81
    Quote Originally Posted by tirna View Post
    I use elements whose name and id are the same without any problems, so I doubt that is your problem.

    I suspect that IE7 does not support a value of 'table-row' for styles.

    Maybe try setting the value to an empty string which results in the display style being set to whatever the default value is for that type of element.

    Code:
     
    
    if(elemObject.style.display != 'none') {
           elemObject.style.display = 'none';
    } else {
           elemObject.style.display = '';
    }
    Well, that actually makes perfect sense to me! Except when I try that, it messes it all up even worse in all browsers.
    Although, there may be some way to fudge things around to make some application of that to work.
    Thanks for the suggestion!

  5. #5
    Join Date
    Mar 2010
    Posts
    2,803
    There must be something else going on in your code that depends on how and where you call toggle_visibility(id).

  6. #6
    Join Date
    Aug 2010
    Location
    Dubai UAE
    Posts
    54
    Just enclose the whole display with a div, then let the div control the display without affecting the inner contents.
    While ( $post !== '[RESOLVE]' ) {
    ToAnswer();
    }

    Web Developer Dubai extensive php and mysql coder even designs can be
    php developer dubai

  7. #7
    Join Date
    Aug 2010
    Posts
    81
    OK, FINALLY got it to work like this:

    Code:
    <script type="text/javascript">
    <!--
        function toggle_visibility(id) {
           var e = document.getElementById(id);
           var f = document.getElementById(id + "b");
    	   
    		if (document.getElementById(id).style.display == 'none') {
    			try {
    				document.getElementById(id).style.display = "table-row";
    			}
    			catch (e) {
    				document.getElementById(id).style.display = "block";
    			}
    		}
    		else {
    			document.getElementById(id).style.display = 'none';
    		}
    		  
    		if (f.style.display == 'none') {
    			try {
    				f.style.display = "table-row";
    			}
    			catch (e) {
    				f.style.display = "block";
    			}
    		}
    		else {
    			f.style.display = 'none';
    		}
    }
    //-->
    </script>
    Ugh, IE7 is a PAIN!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles