CODEWITHSUNDEEP
javascripthtmlasp.net
MustangLover
MustangLover

Reputation: 35

Change Text Box Background Color Using JavaScript

I have tried a few solutions I have seen and none of them are actually changing the background color of my text box. These are the 2 things I have tried
1) state.style.backgroundColor = "#FF0000"

2) state.style.backgroundColor = "red";

And this is the function I am trying to use

<script type="text/javascript">
function VerifyStateWasEntered() {
    var state;
    state = document.getElementByID("txtstate").value; 
    if (state == '') {
        alert("Error Please Enter A Valid State");
        state.style.backgroundColor = "red";
        return false;
    }}



And this is the HTML I am using to create the text box

<asp:TextBox id="txtstate" runat="server" />

Upvotes: 1

Views: 11721

Answers (3)

Leo L.
Leo L.

Reputation: 145

I get that you are trying to make the background color using Javascript but you can use CSS to do that and it will be much more easier.

Example:

<asp:TextBox id="txtstate" runat="server" />
<style type="text/css">
#txtstate {
background-color: /* the color you want */ ;
}

If that still doesn't work, try removing the closing / from <style type="text/css">. Good luck!

Upvotes: 0

faester
faester

Reputation: 15076

What you are attempting is possible, but I suspect you use the wrong ID (as per my comment). To set the color of an element you can use the JavaScript below. 

document.getElementById("txtstate").style.background = "red"

But you need to make sure you have ClientIdMode="static" on the page.

Upvotes: 0

g2000
g2000

Reputation: 490

Can you try this? When you assign the state to the value, you cannot get the style object from value.

<script type="text/javascript">
function VerifyStateWasEntered() {
    var stateObj;

    stateObj = document.getElementByID("txtstate");
    if (stateObj) { 
      var stateValue = stateObj.value; 

      if (stateValue == '') {
        alert("Error Please Enter A Valid State");
        stateObj.style.backgroundColor = "red";
        return false;
      }}   
    }   
</script>

<asp:TextBox id="txtstate" runat="server" ClientIDMode="Static" />

Upvotes: 3

Related Questions