You need to sign in to do that
Don't have an account?
Alex Waddell 12
2-in-1 Questions: Hide Field Name on Visual Force Page / Shift Left
Hello, new developer here. I want to make a few changes aesthetic changes to my VF page
i would like to hide the field name titled - "Note". Since i have a title that enlightens the user on what the VF page is for, the "Note" label is unnecessary.
Also, I want to shift the text box left so it sits flush with the title and Save button. I already have a style to make the text box larger so i know i will need a StyleClass. Wondering if i can get some help to have the style both shift left and have a width of 400
Below is a picture of the VF page (marked with the 2 things i want done) and the code that goes with it
<apex:page standardController="Notes_for_the_Day__c">
<apex:form >
<apex:Pageblock Title="Notes on the Day">
<apex:pageBlockSection columns="1">
<apex:inputField Value="{!Notes_for_the_Day__c.Note__c}"
style="height:100px;width:400px;"/>
<apex:commandButton action="{!save}" value="save"/>
</apex:pageBlockSection>
</apex:Pageblock>
</apex:form>
Thank you in adnvance
i would like to hide the field name titled - "Note". Since i have a title that enlightens the user on what the VF page is for, the "Note" label is unnecessary.
Also, I want to shift the text box left so it sits flush with the title and Save button. I already have a style to make the text box larger so i know i will need a StyleClass. Wondering if i can get some help to have the style both shift left and have a width of 400
Below is a picture of the VF page (marked with the 2 things i want done) and the code that goes with it
<apex:page standardController="Notes_for_the_Day__c">
<apex:form >
<apex:Pageblock Title="Notes on the Day">
<apex:pageBlockSection columns="1">
<apex:inputField Value="{!Notes_for_the_Day__c.Note__c}"
style="height:100px;width:400px;"/>
<apex:commandButton action="{!save}" value="save"/>
</apex:pageBlockSection>
</apex:Pageblock>
</apex:form>
Thank you in adnvance
PFB updated code. Plase note i have added a style class and added style to one class, that is default class which is generated by SFDC once you use Pageblocks. Tried the code and it works.
<pre><apex:page standardController="Contact" extensions="ExampleController">
<style>.pbSubsection{
width: 400px;}</style>
<apex:form >
<apex:Pageblock Title="Notes on the Day" >
<apex:pageBlockSection columns="1" >
<apex:inputField Value="{!contact.lastname}"
style="height:100px;width:400px;"/>
<apex:commandButton action="{!callFutureMethod}" value="save"/>
</apex:pageBlockSection>
</apex:Pageblock>
</apex:form></apex:page>
</pre>
Points to be noted,
1. in all such UI related stuffs, try adding a common style tag and ad your styling there.
All Answers
PFB updated code. Plase note i have added a style class and added style to one class, that is default class which is generated by SFDC once you use Pageblocks. Tried the code and it works.
<pre><apex:page standardController="Contact" extensions="ExampleController">
<style>.pbSubsection{
width: 400px;}</style>
<apex:form >
<apex:Pageblock Title="Notes on the Day" >
<apex:pageBlockSection columns="1" >
<apex:inputField Value="{!contact.lastname}"
style="height:100px;width:400px;"/>
<apex:commandButton action="{!callFutureMethod}" value="save"/>
</apex:pageBlockSection>
</apex:Pageblock>
</apex:form></apex:page>
</pre>
Points to be noted,
1. in all such UI related stuffs, try adding a common style tag and ad your styling there.
How to hide the label?
1. you will have to use the InputText tag instead inputField, but in this case you will loose binding with controller. Will have to write the custom logic.
2. Just use Styling class to hide the label from UI
Cheers!