Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3
  1. #1
    Junior Member
    Join Date
    Feb 2009
    Posts
    18
    Member #
    18405
    Damn it I have another problem

    I am executing a javascript that adds some objects to my page via the HTML DOM
    In the style tags I have

    .chosen {color:blue}

    When I add the "chosen" class to an object I am about to add to a page it works with some objects and not others. If I add it to tabl1 in the code below it works. The table displays blue. If I add this class to a 'td' object it does not display blue. At least in firefox.

    Javascript code:

    var tabl1 = document.createElement('table');
    tabl1.border = 'border';
    display.appendChild(tabl1);
    var tr1 = document.createElement('tr');
    tabl1.appendChild(tr1);
    var tr1d1 = document.createElement('td');
    tr1d1.className = 'chosen'; //Doesn't work
    tr1.appendChild(tr1d1);
    var link = document.createElement('a');
    link.href = 'popup.php?C1=blah';
    link.innerHTML = 'Last Name';
    tr1d1.appendChild(link);";

    Anyway I can make this work? I would like to implement this feature.

  2.  

  3. #2
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Hm. Any chance you can give us a sample page where it doesn't work for you so that we can double-check that we are seeing the same behavior?

  4. #3
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    I see two problems:

    1. You're defining the "color" property for the td element, not the "background-color" property. Are you expecting the cell to have a blue background?

    2. The "color" property affects text inside the container, but is overrided by <a> element styling. Since your text in that cell is wrapped in an anchor, you should use .color a { color: blue } if you want to style the link inside it.

    So given the above, the following worked for me when I tested it out.... the cell has a yellow BG and a red link...

    HTML Code:
    <html>
    <head>
    	<style>
    		.chosen {
    			background-color: yellow;
    		}
    		.chosen a {
    			color:red;
    		}
    	</style>
    	<script language="javascript">
    		function runMe() {
    			var tabl1 = document.createElement('table');
    			tabl1.border = 'border';
    			document.getElementById("display").appendChild(tabl1);
    			var tr1 = document.createElement('tr');
    			tabl1.appendChild(tr1);
    			var tr1d1 = document.createElement('td');
    			tr1d1.className = 'chosen'; //Doesn't work
    			tr1.appendChild(tr1d1);
    			var link = document.createElement('a');
    			link.href = 'popup.php?C1=blah';
    			link.innerHTML = 'Last Name';
    			tr1d1.appendChild(link);
    		}
    	</script>
    </head>
    <body onload="runMe();">
    	<div id="display"></div>
    </body>
    </html>


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 12:14 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com