{"id":1325,"date":"2009-01-20T17:48:29","date_gmt":"2009-01-20T12:18:29","guid":{"rendered":"http:\/\/www.chiragmehta.info\/chirag\/?p=1325"},"modified":"2009-01-21T16:14:49","modified_gmt":"2009-01-21T10:44:49","slug":"salesforce-displaying-the-required-red-bar-for-a-control","status":"publish","type":"post","link":"https:\/\/www.chiragmehta.info\/chirag\/2009\/01\/20\/salesforce-displaying-the-required-red-bar-for-a-control\/","title":{"rendered":"Salesforce &#8211; Displaying the Required Red Bar for a Control"},"content":{"rendered":"<p>Many a times Visualforce page uses a number of outputLabels and selectLists to create the functionality below. <\/p>\n<p><center><img decoding=\"async\" width=\"80%\" src=\"http:\/\/jeffdonthemic.files.wordpress.com\/2008\/11\/red-bar.png\" alt=\"Red Bar\" \/><\/center><\/p>\n<p>&lt;apex:pageBlockSectionItem &gt;<br \/>\n&nbsp;&nbsp;&nbsp; &lt;apex outputLabel value=&#8221;Category 1&#8243; for=&#8221;cbxlevel1&#8243;\/&gt;<br \/>\n&nbsp;&nbsp;&nbsp; &lt;apex outputPanel styleClass=&#8221;requiredInput&#8221; layout=&#8221;block&#8221;&gt;<br \/>\n&nbsp;&nbsp;&nbsp; &lt;apex outputPanel styleClass=&#8221;requiredBlock&#8221; layout=&#8221;block&#8221;\/&gt;<\/p>\n<p>&nbsp;&nbsp;&nbsp; &lt;apex:selectList value=&#8221;{!selectedLevel1}&#8221; id=&#8221;cbxlevel1&#8243; size=&#8221;1&#8243; required=&#8221;true&#8221;&gt;<br \/>\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;apex:selectOptions value=&#8221;{!level1items}&#8221;\/&gt;<br \/>\n&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;apex:actionSupport event=&#8221;onchange&#8221; rerender=&#8221;cbxlevel2&#8243;\/&gt;<br \/>\n&nbsp;&nbsp;&nbsp; &lt;\/apex:selectList&gt;<br \/>\n&nbsp;&nbsp;&nbsp; &lt;\/apex outputPanel&gt;<\/p>\n<p>&lt;\/apex:pageBlockSectionItem&gt;<\/p>\n<p>Setting the selectList\u2019s required attribute makes the select\u2019s value required but does not, by design, display the red bar next to the label. This is perfect is it does not lock developers into Salesforce.com\u2019s look and feel. However, to actually display the required red bar, you have to add some extra code<\/p>\n<p>Ack:- <a href=\"http:\/\/blog.jeffdouglas.com\/2008\/11\/16\/displaying-the-required-red-bar-for-a-control\/\">Jeff Douglas<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Many a times Visualforce page uses a number of outputLabels and selectLists to create the functionality below. &lt;apex:pageBlockSectionItem &gt; &nbsp;&nbsp;&nbsp; &lt;apex outputLabel value=&#8221;Category 1&#8243; for=&#8221;cbxlevel1&#8243;\/&gt; &nbsp;&nbsp;&nbsp; &lt;apex outputPanel styleClass=&#8221;requiredInput&#8221; layout=&#8221;block&#8221;&gt; &nbsp;&nbsp;&nbsp; &lt;apex outputPanel styleClass=&#8221;requiredBlock&#8221; layout=&#8221;block&#8221;\/&gt; &nbsp;&nbsp;&nbsp; &lt;apex:selectList value=&#8221;{!selectedLevel1}&#8221; id=&#8221;cbxlevel1&#8243; size=&#8221;1&#8243; required=&#8221;true&#8221;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;apex:selectOptions value=&#8221;{!level1items}&#8221;\/&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;apex:actionSupport event=&#8221;onchange&#8221; rerender=&#8221;cbxlevel2&#8243;\/&gt; &nbsp;&nbsp;&nbsp; &lt;\/apex:selectList&gt; &nbsp;&nbsp;&nbsp; &lt;\/apex outputPanel&gt; &lt;\/apex:pageBlockSectionItem&gt; Setting [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[32],"tags":[169],"class_list":["post-1325","post","type-post","status-publish","format-standard","hentry","category-salesforce","tag-salesforce","post-preview"],"_links":{"self":[{"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/posts\/1325","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/comments?post=1325"}],"version-history":[{"count":8,"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/posts\/1325\/revisions"}],"predecessor-version":[{"id":1332,"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/posts\/1325\/revisions\/1332"}],"wp:attachment":[{"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/media?parent=1325"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/categories?post=1325"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.chiragmehta.info\/chirag\/wp-json\/wp\/v2\/tags?post=1325"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}