You have a problem with affordance - it is not clear in the UI what someone is supposed to do because you are not using that widget in the way it was supposed to be used.
The instructions which say "Click to select time" actually look disabled, so you are communicating to the user that this feature does not work right now, and thus you are causing confusion, i.e. "I want to follow the instructions and click, however the disabled visual suggests this is not going to do anything because it looks disabled".
If you want the widget to display a pick list when you click, you are limited to only a few options which have much better affordances:
- Hyperlink - the affordance is a very clear "You can click me and something will display"
- Drop-down field - the affordance is a very clear "If you click me a pick list will now display"
- Hyperlink with a drop-down caret (a hybrid of the other two) - the affordance is very a clear "Click me and a pick list will appear"
If the time is read only, simply display the time as plain text on the page, e.g. Time: 13.32. The affordance of plain text is very clear - it is read only and you cannot change it.
Affordances really matter - please don't cause confusion by using one widget with multiple states which you are using incorrectly, when much better interactions are out there.
As others have suggested you might want to allow a user to type the time as this can be a faster interaction. The approach you are looking at where you pick first then can edit by typing is a non-standard interaction which people will not know.