By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,089 Members | 2,069 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,089 IT Pros & Developers. It's quick & easy.

Dynamicly Created Text Box won't take class attribute

dlite922
Expert 100+
P: 1,584
i have a table in which i create the rows dynamically with JS.

Everythings works except my sizes are off. they are controlled via CSS class "field1" to "field8"

Here's the code where i set the class, just like any other attribute, id, name, onBlur...

Expand|Select|Wrap|Line Numbers
  1.  
  2. var vDesc = document.createElement('input');
  3.   vDesc.type = 'text';
  4.   vDesc.name = 'violationDescription[]';
  5.   vDesc.id = 'vDesc' + numRows;
  6.   vDesc.tabindex = tabIndex++;     //don't worry about ++
  7.   vDesc.value = "";
  8.   vDesc.class = "field6";                //<------- does not work
  9.   var cell = row.insertCell(1); 
  10.   cell.appendChild(vDesc); 
  11.  
  12.  
weather i change it to field 2 or 8, the text box appears as a standard size.

It is NOT a css problem, because on refresh the textboxes that are there by default display the correct size.

i could do this, but haven't tried
vDesc.style.size = "";

However that defeats the point of putting all formatting in a CSS file.

Anybody know why Firefox 2.0 disregards the class?

(can't test in IE6/7 yet because its got other issues)
Jan 20 '08 #1
Share this Question
Share on Google+
2 Replies


100+
P: 210
Expand|Select|Wrap|Line Numbers
  1.  
  2. vDesc.class = "field6";                //<------- does not work
  3.  
vDesc.className = "field6";
Jan 20 '08 #2

dlite922
Expert 100+
P: 1,584
vDesc.className = "field6";
that worked. i got it from the manual as well, just didn't test it until now.

Just in case someone else comes accross this, i attempted to modify the style and you'll run into a problem with attributes that have dashes in them such as

document.something.style.text-align = "right"

They've enabled these properties in hungarian case, to work you must change text-align to textAlign.

document.something.style.textAlign = "right";

(for the sake of google keyword search & linking:
background-color = backgroundColor
border-color = borderColor
border-width = borderWidth
etc....)
Jan 21 '08 #3

Post your reply

Sign in to post your reply or Sign up for a free account.