# How to Set background color to flex repeater **URL:** \ **Category:** Ignition\ **Created:** [October 20, 2021, 11:41am UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151 "2021-10-20T11:41:02Z")\ **Posts on this page:** 12\ **Page:** 1
**Author:** ![Anita.Shinde](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@Anita.Shinde](https://forum.inductiveautomation.com/u/Anita.Shinde)\ **Post date:** [October 20, 2021, 11:41am UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/1 "2021-10-20T11:41:02Z")
Hi, I have one screen in that I have used multiple flex repeaters. I want to do search functionality, What ever number entered in text field to search, It should get highlight. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/9/19695c9537c63f1cd24924b16da2b69984abf573.png) here I am searching for 180 so 180 should be highlight in orange color. I have tried by setting background color but it is not working. Thanks. ---
**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\ **Post date:** [October 20, 2021, 11:55am UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/2 "2021-10-20T11:55:31Z")
I think we’re gonna need more details about how you search, and how you’re trying to change the background color. ---
**Author:** ![Anita.Shinde](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@Anita.Shinde](https://forum.inductiveautomation.com/u/Anita.Shinde)\ **Post date:** [October 20, 2021, 11:59am UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/3 "2021-10-20T11:59:27Z")
I have one label which is I am using in flex repeater. On background color property I am checking, If label text=searchLable(180) then set orange color else set green color ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [October 20, 2021, 12:12pm UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/4 "2021-10-20T12:12:24Z")
how are you filling up these flexrepeaters? you can set the style of an instance of the flexrepeater in property `instances[x].instanceStyle` ---
**Author:** ![Anita.Shinde](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@Anita.Shinde](https://forum.inductiveautomation.com/u/Anita.Shinde)\ **Post date:** [October 20, 2021, 12:20pm UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/5 "2021-10-20T12:20:09Z")
To flex repeater instances I am binding a tag(dataset). ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/a/2a675533b46939fd2d51053d4080db19d8c667dc.png) Like this. ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [October 20, 2021, 12:48pm UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/6 "2021-10-20T12:48:09Z")
Add a viewproperty: self.view.params.search ? then in the bindings you will have to add these to params (before appending it to instances): ```auto if str(stopId) == str(self.view.params.search): params['instanceStyle'] = {'backgroundColor':'orange'} else: params['instanceStyle'] = {'backgroundColor':'green'} ``` You could put something like this on the search button: If the bindingss refresh really fast you wont need to do the forloop here just change the view.param (first 2 lines) ```auto stringToFind = self.getSibling("TextField").props.text self.view.params.search = str(stringToFind) flexRepeaters = [self.getSibling("FlexRepeater"),self.getSibling("FlexRepeater_0")] for x in flexRepeaters: for inst in x.props.instances): if (str(inst.stopId) == str(stringToFind)): inst.instanceStyle['backgroundColor']='orange' else: inst.instanceStyle['backgroundColor']='green' ``` ---
**Author:** ![Anita.Shinde](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@Anita.Shinde](https://forum.inductiveautomation.com/u/Anita.Shinde)\ **Post date:** [October 20, 2021, 1:34pm UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/7 "2021-10-20T13:34:48Z")
where I need to put this code, On background property of label? ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [October 20, 2021, 1:50pm UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/8 "2021-10-20T13:50:59Z")
> [@victordcq](#): > > ```auto > if str(stopId) == str(self.view.params.search): > params['instanceStyle'] = {'backgroundColor':'orange'} > else: > params['instanceStyle'] = {'backgroundColor':'green'} > > ``` this on the flexrepeaters the other one on the search button assuming the search button is in the same view as the flexrepeaters if you want to use it on the level of the labels you will have to bind the search text field to a custom session prop. thatway the labels will be able to reach that prop too. But this should be done on the flexrepeater level for good practice (i guess) ---
**Author:** ![Anita.Shinde](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@Anita.Shinde](https://forum.inductiveautomation.com/u/Anita.Shinde)\ **Post date:** [October 20, 2021, 2:01pm UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/9 "2021-10-20T14:01:49Z")
Search button is on another view, through embedded view I am showing that view. ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [October 20, 2021, 2:06pm UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/10 "2021-10-20T14:06:38Z")
then you could use messages or just use the session prop i guess ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [October 20, 2021, 2:37pm UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/11 "2021-10-20T14:37:02Z")
The setting of params within a transform of the binding will not work, because those will only update or evaluate when the binding updates. You will indeed want to use either a Message Handler or a Session Property here. Use an onChange script for your Text Field (or Numeric Entry Field).: ```auto system.perspective.sendMessage('SEARCH', payload={"value": currentValue.value}, scope="page") ``` Then your Label should have a configured listener with the following code: ```auto if float(payload["value"]) == float(self.props.text): self.props.style.backgroundColor = "orange" else: self.props.style.backgroundColor = "green" ``` ---
**Author:** ![Anita.Shinde](https://avatars.discourse-cdn.com/v4/letter/a/c2a13f/32.png) [@Anita.Shinde](https://forum.inductiveautomation.com/u/Anita.Shinde)\ **Post date:** [October 20, 2021, 2:56pm UTC](https://forum.inductiveautomation.com/t/how-to-set-background-color-to-flex-repeater/52151/12 "2021-10-20T14:56:38Z")
Thank you so much, It worked.