IDs of elements change on page reload in XML Views

[former_member190882]

Hi Experts,

I have designed couple of SAPUI5 XML views. Due to the requirement that the buttons and other controls should have colors and other CSS properties, which are not part of standard theme, I am modifying the CSS properties using their IDs. But a strange problem has pop up, that the IDs change abruptly on page reload.

For example the ID of a check box control in the second view is __xmlview1--selectStatusComboBox. But when the page is refreshed, the ID changes to __xmlview0--selectStatusComboBox abruptly. Therefore the CSS properties written for that element no longer apply. This is a strange problem I have come across an see no solution. Please help.

Thanks

Maruthi

[former_member182862]

HI

You have to set id for your checkbox control. Otherwise, SAPUI5 will generate one for you. and the generated ID can be different everytime.

Thanks

-D

[former_member190882]

Hi Dennis,

Thanks for your response. I have set the id for the checkbox control i.e., selectStatusComboBox. SAPUI5 is appending the view id to it, and that part of the ID is changing on every page reload.

Thanks

-Maruthi

[vladimirs_semikins]

One of this options should work

div[id*="selectStatusComboBox"] {
    background: red;
}

.sapMComboBox[id*="selectStatusComboBox"] {
    background: red;
}

.sapMComboBox.yourAppendedCustomClass{
    background: red;
}

[iamsahu]

this works for me thank you 🙂