CODEWITHSUNDEEP
javascriptcss
Helloitsme
Helloitsme

Reputation: 23

Changing color of input value

I have login script where are inputs email and password. Email input value is set "email" but when It's not correct i added a script which change value to "email not correct" but i wanted it have color red. Code below do not work. How do i change it?

<input id="email" type="text" name="logemail" placeholder="Email">


echo '<span class=\'wrong\'>
      <script>
      document.getElementById("email").value = "incorrect email";
      </script>
      </span>';

CSS:

.wrong{
color:red;
}

Upvotes: 1

Views: 123

Answers (2)

vinod
vinod

Reputation: 2880

Use separate javascript function to add class dynamically. 

<script>
    function addClass(element, myClass) {
        element.className += ' ' + myClass;
}
</script>
<span class='wrong1'>
    <script>
        document.getElementById("email").value = "incorrect email";
        var foo = document.getElementById('email');
        addClass(foo, 'wrong');
    </script>
</span>

Upvotes: 1

Anshu Dwibhashi
Anshu Dwibhashi

Reputation: 4685

Your CSS changes the value of text in the span element not the input value of the text box. Technically speaking, your current code only changes the colour of the "innerHTML" of the span element not the "value" of the input element.

Change 

.wrong{
    color:red;
}

To

#email{
    color:red;
}

To get the desired behaviour...

Upvotes: 2

Related Questions