Help with selectors

I am in activesg website. I am trying to book a timeslot. There two types of buttons, one is red means unavailable and another one is black means available. I am trying to use Element exists to fin black button if yes, click on it. However. it cannot identify between black or red buttons

Inspector code for red button:

Inspector for black button:

there are differences in the codes as you can see but in UiExplorer, I can’t find any difference in code…

Kindly help.

Thank you xoxo

I don’t have access to the website, but seems like the “black” button should have name attribute (in this case timeslots[] while the red has no name attribute.
Maybe you can start with that?

@sangasangasanga

You can compare all properties of both the buttons from Property Explorer. There has to be some difference.

Then you can use get attribute for the found property and then can make out which one to click.

Thanks,
Madhura

@sangasangasanga
The html inspect image you provided are not clear. But from the image i can say, there is a separate class added for the Red Button with css property background-color: #c33825;
You can use this class name to differentiate between two buttons and create your selector. Please provide website access or more clear image displaying all properties to analyze further.
Hope this is helpful!

@ajeed myactive.sg is a local website for public.

both buttons have the same name attributes.

Black button:

Red button:

both seems to have the same attributes though :frowning:

@Madhuraj yes i agree there has to be some difference but but the properties seems the same :frowning:

@Madhavi sorry for the unclear html inspect image:

black button:
image

red button:
image

yes, the css property background-colour differs for both, but I cannot find that property in selector editor.

I even tried to manually add the css property background colour in but my syntax is wrong. :frowning: pls help

Hi @sangasangasanga,
I think you should extend your selector to “input” element instead of “label”. The different between red and black input is based on enable/disable. Use the get attribute of “aastate” of the element to differentiate between red and black, and you may find your answer.

@ajeed I have tried like you said, however the aastate is enabled for both black and red buttons.

Below is for red button:

The red button has a separate class attribute :disabled
Use that to create a selector.

@Madhavi it isn’t showing in the UI explorer

Is its possible to share the web page link. I cant inspect and let you know.

@Madhavi it is Singapore’s local public website. You can change google’s region to singapore and access that website

@sangasangasangaI am able to access website. but not getting how to navigate to specified page.

@Madhavi You have to login with your email id and click on facilities. And search for badminton and any click on any result and you will be able to navigate to the page i am referring to