Adri Cist
Adri Cist

Reputation: 37

Chaging the background color of an input field with JQuery

I am trying to change the background colour of one input field on a form based on the value of another input field. While the following code works correctly for changing the readonly property of the field, none of the following 3 lines of code, as well as many others I have tried, seem to work for changing the background colour.

               if(names[6] == "Yes") {

                    $('#add_at_inv2_client').val(names[3]);

                    $('add_at_inv2_client').prop('background-color','#fefefe');
                    $('#add_at_inv2_client').prop('object.style.backgroundColor="#fefefe"');
                    $('add_at_inv2_client').css('background', '#fefefe');

                    $('#add_at_inv2_client').prop('readonly',false);

                } else {

                    $('#add_at_inv2_client').val(names[3]);

                    $('add_at_inv2_client').prop('background-color','#cccccc');
                    $('#add_at_inv2_client').prop('object.style.backgroundColor="#cccccc"');
                    $('add_at_inv2_client').css('background', '#cccccc');

                    $('#add_at_inv2_client').prop('readonly',true);

                }

Can someone please help me achieve this?

Thanks, Adri

Upvotes: 0

Views: 2858

Answers (4)

Adri Cist
Adri Cist

Reputation: 37

Thank you! I have been copying and pasting all those trials without the #

I have now settled for this and it seems to be working fine!

$('#add_at_inv2_client').attr('style','background-color:#fefefe;');

Thank you all, Adri

Upvotes: 0

Kiran Shahi
Kiran Shahi

Reputation: 7980

Use css() method for background-color property. And use . for class and # for id before selector.

$('#selector').css({"background-color":"#fefefe"});

Upvotes: 0

Minar_Mnr
Minar_Mnr

Reputation: 1405

You are missing ID property

$('#add_at_inv2_client').css('background', '#cccccc'); // # missing from start

Upvotes: 1

flyingfox
flyingfox

Reputation: 13506

You have missing # in your select code,
so change
$('add_at_inv2_client').css('background', '#fefefe');
to
$('#add_at_inv2_client').css('background', '#fefefe');

Upvotes: 1

Related Questions