+ Start a Discussion
SalesforceLearnerNewbieSalesforceLearnerNewbie 

Created side by side columns in VF page

Hi,

 

I would like to create a VF page that has two pages/views combined on one page. For example,


VF page:

l       layer1            l      layer 2               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
l                            l                               l
 

The Left side of the view:


Layer 1 will have some kind of a text area for user to include their input. After user included their input, there will be a button to press for "Ok".. *I know how to make this page but I do not know how to make it in one side in this case on the left side of the view*

The right side of the view:

this will print all the values that inserted by user. *For printing, I think I know how to do but I do not know how to make it at the right side*

My question is how to make these two layers to be side by side and to have their own information.

Vishal_GuptaVishal_Gupta
Hello,

You can use Apex:PageBlock with column=2 for ex :
<Apex:form >
        <Apex:pageBlock>
            <apex:pageBlockSection  columns="2">
            <apex:outputPanel style="width:100%;height:100% ">
                <apex:inputTextarea style="width:100%;height:100%;" label="Left Side"></apex:inputTextArea>
            </apex:outputPanel>
            <apex:outputPanel style="width:100%;height:100%;">
                <apex:inputTextarea style="width:100%;height:100%;" label="Right Side"/>
            </apex:outputPanel>
            </apex:pageBlockSection>
        </Apex:pageBlock>
    </Apex:form>

Let me know if its resolve your problem.