You are viewing limited content. For full access, please sign in.

Question

Question

change background color when dropdown value changes

asked on April 27, 2021

I want the background of this field to be red when the value selected is 2.

How can I do that?

 

0 0

Answer

SELECTED ANSWER
replied on April 28, 2021 • Show version history

Collection and table item onchange events are handled by the collection.  So you must use the collection event and then check the sub items.  I have a Collection with class = MyCollection and then in the collection, I have a dropdown with a class = ddList.

$(document).ready(function () {
  $('.MyCollection').change(function(){
    $('.ddList').each(function() {
      var currentList = $(this).find('option:selected');
      if (currentList.text() == "2")
      {
        $(this).find('select').css("background-color", "#FF0000");
      }
      else
      {
        $(this).find('select').css("background-color", "#FFFFFF"); //default background color
      }
    });
  });
});

 

2 0
replied on April 28, 2021

Perfect.  Thank you. 

0 0

Replies

replied on April 27, 2021

Hi Katy,

You can use custom JavaScript as follows

$(document).ready(function () {
    $("#Field1").change(function (event) { //Field1 is the dropdown
      if ($(this).val() == "2")
      {
        $("#Field1").css("background-color", "#FF0000");
      }
      else
      {
        $("#Field1").css("background-color", "#FFFFFF"); //default background color
      }
    });
});

 

1 0
replied on April 28, 2021

Thank you!  

0 0
replied on April 28, 2021

What about if this was in a collection?  It doesn't work this way when my field is in my collection?  Hmmm...

0 0
replied on April 28, 2021

What am I missing?

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.