Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
ColinKenworthy1ColinKenworthy1 

How do I alter dimensions of inputField Text and TextArea fields ?

I'm creating a VF page for Solutions but the SolutionName and SolutionNote input fields display way too small.

 

In the regular screens they display quite large and there is room for plenty of text to be entered before anything starts scrolling.

 

 

 

Am I missing some parameter screen where you can specify the input field width ?  Is it something you can do in Apex ?

Best Answer chosen by Admin (Salesforce Developers) 
johutchjohutch

You'll lose the functionality of the inputField but you can instead use inputTextArea.  It contains two attributes cols and rows which desiginate how big the text area is length by width.

 

I would use the following syntax: 

<apex:pageblocksectionItem>
    <apex:outputlabel value = "Solution Note"/>

    <apex:inputtextArea value = "{!solution.note}" cols = "50" rows = "5"/>
</apex:pageblocksectionItem
 
 


All Answers
Rajesh ShahRajesh Shah
You can provide the width in style attribute of inputField.
 
Following is the exampleto have a custom width for a textArea field.
<apex:inputField id="Comments" value="{!Contact_Exemption.Comments__c}" style="width:75%"/>  


ColinKenworthy1ColinKenworthy1
Thanks, that sorts the width :)
 
Is there any way to affect the height ?  (It defaults to 3 rows but I would like to show 12 rows)
 
 
Can only the width be overridden, this seems so fundamental to an input VF page!!


johutchjohutch
You'll lose the functionality of the inputField but you can instead use inputTextArea.  It contains two attributes cols and rows which desiginate how big the text area is length by width.
 
I would use the following syntax: 
<apex:pageblocksectionItem>
    <apex:outputlabel value = "Solution Note"/>

    <apex:inputtextArea value = "{!solution.note}" cols = "50" rows = "5"/>
</apex:pageblocksectionItem
 
 
This was selected as the best answer
Rajesh ShahRajesh Shah
Even I tried to increase the height but it does not works the way width worked. The only other way is what 	
johutch has suggested.


ColinKenworthy1ColinKenworthy1
Thanks johutch, 
 
exactly what functionality have I lost by not using the inputField ?
 
 
 
Colin.


johutchjohutch
ive found that when using inputField you get the Error message and required field red bar for that field.  when using the inputText or inputTextArea, the error message and required field bar do not appear for that field.  you'll have to recreate that functionalilty yourself.


Dmitry Loktevich 9Dmitry Loktevich 9
apex:inputField supports HTML pass-through attributes and for textarea fields you can use rows and cols with this syntax:



<apex:inputField value="{! anyTextAreaField }" html-rows="5" html-cols="50" />