1

Creating an element using visualforce:

<apex:input id='myid'/>

results in:

<input id="j_id0:j_id5:j_id50:myId" type="text" name="j_id0:j_id5:j_id50:myId">

What is the purpose of adding this extra stuff to the id? Is there any way to prevent visualforce from doing this? It seems like some of slds isn't compatible with visualforce for this reason

Improve this question
3
  • 1
    What is it exactly you think this scheme is breaking in slds? If what you are trying to do is fix that, then this question would have been better written to actually ask about that with a specific example. As is, now that you have a few answers here, getting an answer to that question would be best pursued via separate post.
    – Adrian Larson ♦
    Jan 9, 2019 at 14:21
  • When you try to use apex:inputCheckbox with slds it's more complicated to get it working because the input has a more complex id. Is there an appropriate place to ask "why" type questions? I'm kind of interested in the reason for the ids to be like that.
    – Mark
    Jan 9, 2019 at 14:28
  • 1
    Why questions are typically pretty difficult to answer, though this one may be less so than most. That said, asking why the ids are like this doesn't really help you solve your problem, which is what I was getting at.
    – Adrian Larson ♦
    Jan 9, 2019 at 14:31

2 Answers 2

Reset to default
3

The technical reason is that your code is compiled in to Java Server Pages (last I heard), and that framework generates ID values like this to know which HTML elements are updated correctly during reRendering. The underlying reason there is that you can commingle normal HTML and custom components without conflicting ID values. There's no way to "fix" this, because those ID values must be in that format for the page to work correctly. To reference these ID values correctly, we use the $Component merge field:

var refId = "{!$Component.block1.firstName}";
Improve this answer
1

You can find the solution here Visualforce Developer Guide - Best Practices for Accessing Component IDs.

A DOM ID is constructed from a combination of the id attribute of the component and the id attributes of all components that contain the element.

Improve this answer

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .