+ Start a Discussion
Arvind1Arvind1 

Displaying selectoptions one below other

Hi all,

 

I have two custom objects questions and answers. Answers object has a lookup to questions object.

I am displaying a question name and the answers related to that question as radio buttons  in a row of a datatable.

 

I am using the following code for that

<apex:dataTable value="{!surveyListPage}" var="surveyqns" cellpadding="10">
              
              <apex:column rendered="{!ISNULL(surveyqns.question.Question_Name__c)}">
                   <apex:outputText value="{!surveyqns.question.Question_Number__c}"/>
                   &nbsp;&nbsp;&nbsp;&nbsp;
                  <apex:outputText value="{!surveyqns.question.Name}"/>
              </apex:column>
              <apex:column rendered="{!NOT(ISNULL(surveyqns.question.Question_Name__c))}">
                  <apex:outputText value="{!surveyqns.question.Question_Number__c}"/>
                   &nbsp;&nbsp;&nbsp;&nbsp;
                  <apex:outputText value="{!surveyqns.question.Question_Name__c}"/>
              </apex:column>    
              <apex:column breakBefore="true" rendered="{!surveyqns.question.Type__c == 'Radio'}">
                  <apex:selectRadio value="{!surveyqns.response.Response_Text__c}"
                  rendered="{!surveyqns.question.Type__c == 'Radio'}">
                            <apex:selectOptions value="{!surveyqns.ansop}"/>
                        </apex:selectRadio>
              </apex:column>
              <apex:column >
                  <apex:inputField value="{!surveyqns.response.Response_Number__c}" rendered="{!surveyqns.question.Type__c == 'Number'}"/>
              </apex:column>
          </apex:dataTable>

 

 

Here all the answer options are coming as radiobuttons in a single line. How do I display the answer options one below the other?

 

Any suggestion will be helpful

 

Thanks

Arvind

 

 

Best Answer chosen by Admin (Salesforce Developers) 
MikeGinouMikeGinou

Use the layout attribute of the selectRadio control. Setting layout="pageDirection" will lay the options out vertically instead of the default.

 

 

<apex:selectRadio value="{!surveyqns.response.Response_Text__c}" rendered="{!surveyqns.question.Type__c == 'Radio'}" layout="pageDirection">
    <apex:selectOptions value="{!surveyqns.ansop}"/>
</apex:selectRadio>

 

See the VisualForce documentation for all of the available attributes on selectRadio.

 

 

All Answers

MikeGinouMikeGinou

Use the layout attribute of the selectRadio control. Setting layout="pageDirection" will lay the options out vertically instead of the default.

 

 

<apex:selectRadio value="{!surveyqns.response.Response_Text__c}" rendered="{!surveyqns.question.Type__c == 'Radio'}" layout="pageDirection">
    <apex:selectOptions value="{!surveyqns.ansop}"/>
</apex:selectRadio>

 

See the VisualForce documentation for all of the available attributes on selectRadio.

 

 

This was selected as the best answer
Arvind1Arvind1

Thanks Mike, it worked great.... There are so many things which I am still not aware

 

Thanks

Arvind