Search code examples
xpages

How to add an attribute without a label to XPages control?


For an xp:inputtext control I would like to add the attribute [aria-required='true'] but I am wondering how I could achieve that via the attributes property without having to set a label?

I have tried:

<xp:this.attrs>
    <xp:attr>
        <xp:this.value><![CDATA[[aria-required='true']]]></xp:this.value>
    </xp:attr>
</xp:this.attrs>

But then I get as error message:

Description Resource Path Location Type Required property "name" for xp:attr is not present.


Solution

  • I am not sure I understand what you mean by "without having to set the label". <xp:attrs> holds a collection of one or more <xp:attr> components. Then the <xp:attr> component holds 2 attributes name= (String only) and value= (String only).

    So if you want to set a custom attribute for the HTML counterpart tag you must write:

    <xp:inputText ...>
        <xp:this.attrs>
            <xp:attr name="aria-required" value="true" />
        </xp:this.attrs>
    </xp:inputText>
    

    If you want to kind of automate the presence of certain attributes you can also define a theme rule and apply it (of course if you have other styles and/or rules usually applied to the input you must make sure to repeat them again in the new rule):

    The theme rule

    <control>
        <name>Input.AriaRequired</name>
        <property>
            <name>attrs</name>
            <complex type="xp_attr">
                <property>
                    <name>name</name>
                    <value>aria-required</value>
                </property>
                <property>
                    <name>value</name>
                    <value>true</value>
                </property>
            </complex>
        </property>
    </control>
    

    The input with the applied theme

    <xp:inputText themeId="Input.AriaRequired" ... />