function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Russell baker 1Russell baker 1 

VF page with divide one textbox in 4 section like this

like this picture
Chandra Prakash PandeyChandra Prakash Pandey
Hi Russell,

It can be done easily....

User-added image

VF Page Code: 
<table width="50%" border="2" style="border-collapse: collapse;padding:0px;">
    <tr>
        <td> 
            <apex:inputTextarea style="width:98%;" rows="20" value="{!txtContent1}"/> 
        </td> 
        <td> 
            <apex:inputTextarea style="width:98%;" rows="20" value="{!txtContent2}"/> 
        </td> 
    </tr> 
    <tr> 
        <td> 
            <apex:inputTextarea style="width:98%;" rows="20" value="{!txtContent3}"/> 
        </td> 
        <td> 
            <apex:inputTextarea style="width:98%;" rows="20" value="{!txtContent4}"/> 
        </td> 
    </tr> 
</table> 
<apex:commandButton value="Show Data" action="{!getFullContent}" reRender="lblDisplayContent"/> 
<apex:outputLabel id="lblDisplayContent" value="{!fullContent}"></apex:outputLabel>

Apex Code: 
public string fullContent {get; set;} 
public string txtContent1 {get; set;} 
public string txtContent2 {get; set;} 
public string txtContent3 {get; set;} 
public string txtContent4 {get; set;} 

public void getFullContent() 
{ 
    fullContent = txtContent1 + ' ' + txtContent2 + ' ' + txtContent3 + ' ' + txtContent4; 
}

Now just click Show Data button on VF Page and you will get your desired concatenated content.

You can convert this entire code in a component shape also so that you can reuse the same on the multiple places.

Let me know if you need more help on this.

Regards,
Chandra Prakash
pandey.chandra2011@gmail.com