Change the color of a field based on returned result within field

i wanted to change the field value to green after selecting the value "OK" and red on "NOK" and so on. i have used the js code like the below code but it is not working like before clicking the sumbit button colours are changing but after it is submitted the field colour is again white.

 $(document).ready(function(){
    if(document.getElementById('janadd').value == 'NOK') {
      document.getElementById('janadd').style.background-color = "red";
    }
    else if (document.getElementById('janadd').value == 'OK') {
      document.getElementById('janadd').style.background-color = "green"; 
     } 
    else if(document.getElementById('janadd').value == 'Partial'){
     document.getElementById('janadd').style.background-color = "yellow"; }
    };
 });

31 thoughts on “Change the color of a field based on returned result within field”

  1. $(document).ready(function(){
        var value = $('#janadd').attr("value");
    
        if( value == 'NOK') {
          $('#janadd').css("background-color", "red");
        }
        else if (value == 'OK') {
                    $('#janadd').css("background-color", "green"); 
         } 
        else if(value == 'Partial'){
                   $('#janadd').css("background-color", "yellow");
        };
     });
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    
    <div id="janadd" value="Partial">Yellow Color</div>

    i use the jquery syntax:

    $(document).ready(function(){
        var value = $('#janadd').attr("value");
        if( value == 'NOK') {
          $('#janadd').css("background-color", "red");
        }
        else if (value == 'OK') {
                    $('#janadd').css("background-color", "green"); 
         } 
        else if(value == 'Partial'){
                   $('#janadd').css("background-color", "yellow");
        };
     });
    
    Reply
  2. I loved as much as you will receive carried out right here.
    The sketch is tasteful, your authored subject matter stylish.
    nonetheless, you command get bought an nervousness over
    that you wish be delivering the following. unwell unquestionably
    come further formerly again as exactly the same nearly a
    lot often inside case you shield this increase. https://cialis360.jueriy.com/tadalafil

    Reply

Leave a Comment