Visualforce loose HTML5 attributes for dependent picklists

Question

When I create Visualforce page with HTML5, I see, that when I use such constructions:

<apex:inputfield html-dType="foo" .../>

Visualforce loose all my attributes on dependent picklists. It looks like the issue of Salesfore, but maybe just I do something wrong. What is the cause of it?

Answer 1

You are correct, this is something Salesforce is doing. It maintains the attribute on the parent but not on the child. Depending on what you need the attributes for and where the values are coming from, you could add them in manually using javascript. This certainly will not work for all use cases. Since you also cannot put a class on the child, I wrapped it in a div.

<apex:inputField styleClass="parent" value="{!object__c.parent__c}" />
<div id="child-wrapper">
    <apex:inputField value="{!object__c.child__c}" />
</div>  

<script>
    function reAttribute() {
        setTimeout(function() {
            $("#child-wrapper select").attr("dType","foo");}
            , 500
        )
    }
    $(function() {
        reAttribute();
        $(".parent").change(function() {
            reAttribute();
        });
    });
</script>