meda
meda

Reputation: 45500

Unable to change TextBox color?

Here's a TextBox:

<asp:TextBox ID="UsernameTextBox" runat="server" class="BlockInput"></asp:TextBox>

I wanna give an asp textbox some color but its not changing color

 <script type="text/javascript">
     function BlockInput() {
         var elements = document.getElementsByClassName("BlockInput");
         for (var i = 0; i < elements.length; i++) {
             elements[i].readOnly = true; // works
             elements[i].style.color = "#000000";// does not work!
         }
     }
     window.onload = BlockInput;
</script>

When I view source I could see the style being added:

<input name="ctl00$MainContent$UsernameTextBox" 
       type="text" id="MainContent_UsernameTextBox"
       class="BlockInput" readonly="" style="color: rgb(0, 0, 0);">

I also made sure nothing is overwriting the css.

Upvotes: 1

Views: 274

Answers (3)

Paul Rad
Paul Rad

Reputation: 4882

The variable elements is undefined. Do you want to make something like ? :

function BlockInput() {
         var elements = document.getElementsByTagName('input');
         for (var i = 0; i < elements.length; i++) {
             elements[i].readOnly = true; // works
             elements[i].style.color = "#000000";// does not work!
         }
     }

Fiddle

Upvotes: 1

Kiranramchandran
Kiranramchandran

Reputation: 2094

change

elements[i].style.color = "#000000";

to

elements[i].style.backgroundColor= "#000000";

hope this will help you.

<script type="text/javascript">
     function BlockInput() {
var elements=document.getElementsByTagName('input');
         for (var i = 0; i < elements.length; i++) {
             elements[i].readOnly = true; // works
             elements[i].style.backgroundColor= "#000000";
         }
     }
     window.onload = BlockInput;
</script>

Upvotes: 3

Speedy
Speedy

Reputation: 198

With the color style you are setting the text color to black. If you want to change the background color of the textarea, try this:

elements[i].style.backgroundColor = "#000000";

Upvotes: 0

Related Questions