Skip to main content

Customizing the width of a UI control using contentStyle attribute

You can use contentStyle attribute to override the default width of specific types of UI controls. This property is applicable for single select and multiple select controls( af:selectOneChoice, af:selectManyShuttle, af:selectBooleanRadio etc.) and input controls( af:inputText, af:inputRangeSlider, af:inputListOfValues,af:richTextEditor etc. ).

<af:selectOneChoice  contentStyle="width:200px" label="Select an Item:" id="soc1">

From Web User Interface Developer's Guide ...
If the field is wider than the space allocated, the browser will not truncate the field but instead will take space from the label columns. This potentially could cause the labels to wrap more than you would like. In this case, you may want to consider reducing the width of the field contents (for example, use a smaller contentStyle width on an inputText component).

However, you should be cautious while using 'contentStyle' to override the default width of the controls, especially with controls like af:selectOneChoice. In case of af:selectOneChoice, by default, run time would try to set the 'width' by considering the maximum size of the displayed list item values. This 'defaulting behavior' is useful if your application is later enhanced to support a different language where the width of the af:selectOneChoice may vary based on the language characteristics.


Anonymous said…
Thanks!! Very helpful
ravi said…
Thanks jobinash!
mosta said…
that was helpful, Thanks

Popular posts from this blog

How to set Bind Variable Values at runtime ?

In this post I'm sharing a couple of approaches for programmatically setting bind variables values at run time. This post is an attempt to explain 'When to use what ?'[ In case if you are familiar with 'Bind Variables' in ADF BC, please refer Section 5.10, Working with Bind Variables in Fusion Developer's Guide ]

1. Set the Bind Variable value using RowSet::setNamedWhereClauseParam(...)

You can use use the setNamedWhereClauseParam(...) method on the ViewObject interface (which extends oracle.jbo.RowSet) to set the value for bind variables. Please note this sets the value on default RowSet. In other words, this doesn't have any effect on the secondary RowSets that you/system generates.
ViewObject vo = am.findViewObject("EmployeesView1"); vo.setNamedWhereClauseParam("bindVarDeptId", new Number(10)); vo.executeQuery();
2. Set the Bind Variable value using ViewObject's VariableValueManager::setVariableValue(...)

VariableValueManager Ma…