Apex Code Development You need to sign in to do that
Don't have an account?
Emmanuel Corona Order items by columns
Greetings!
I have a vfp web to lead, and i would like to order the fields in one column, in another add some videos but i'm not able to do that, someone can help me??? i'll really appreciate your help
<apex:pageBlockSection title="Solicitud de Información" collapsible="true" columns="1" >
<apex:inputField value="{!Lead.FirstName}" label="Nombre (s)" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.LastName}" label="Apellido (s)" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.Email}" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.Phone}" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.Company}" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:iframe width="420" height="315" src="http://www.youtube.com/embed/Qd8OtvSgal8"/>
................
I have a visualforce page web to lead, here is my code:
<apex:page standardController="Lead" extensions="myWeb2LeadExtension,reCAPTCHA" title="Interesado en Contratar Servicios de MCM" showHeader="false" standardStylesheets="true">
<apex:composition template="{!$Site.Template}">
<apex:define name="body">
<apex:form >
<apex:messages id="error" styleClass="errorMsg" layout="table" style="margin-top:1em; background-color: #FF9300" />
<apex:pageBlock title="" mode="edit" id="sider2_header" >
<apex:pageBlockButtons rendered="{!(verified)}">
<apex:commandButton value="Enviar" action="{!saveLead}" />
</apex:pageBlockButtons>
<apex:pageBlockSection title="Solicitud de Información" collapsible="true" columns="1" >
<apex:inputField value="{!Lead.FirstName}" label="Nombre (s)" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.LastName}" label="Apellido (s)" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.Email}" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.Phone}" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.Company}" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.NumberOfEmployees}" Label="Número Aproximado de Empleados" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.Industry}" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input" />
<apex:inputField value="{!Lead.Street}" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.City}" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.State}" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.PostalCode}" style="width: 200px; height: aut; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.ProductoInteres__c}" style="width: Auto; height: auto; background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.ProveedoresVozActual__c}" label="Proveedor Actual de Voz" style="width: Auto; height: auto;background-color: #E0FFFF" styleclass="input"/>
<apex:inputField value="{!Lead.ProveedoresDatosActual__c}" label="Proveedor Actual de Datos" style="width: Auto; height: auto;background-color: #E0FFFF" styleclass="input" />
<apex:inputField value="{!Lead.Description}" Label="Comentarios" style="width: 200px; height: 1000; background-color: #E0FFFF" styleclass="input"/>
<!-- Show the reCAPTCHA form if they are not yet verified -->
<apex:pageBlockSectionItem rendered="{! NOT(verified)}">
<!-- reCAPTCHA verification
Source: https://developers.google.com/recaptcha/docs/display -->
<script type="text/javascript"
src="https://www.google.com/recaptcha/api/challenge?k={!publicKey}">
</script>
<noscript>
<iframe src="https://www.google.com/recaptcha/api/noscript?k={!publicKey}"
height="300" width="500" frameborder="0"></iframe><br/>
<textarea name="recaptcha_challenge_field" rows="3" cols="40"></textarea>
<input type="hidden" name="recaptcha_response_field"
value="manual_challenge"/>
</noscript>
<!-- end reCAPTCHA verification -->
</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem >
<apex:commandButton action="{!verify}"
value="Verificar Código" rendered="{! NOT(verified)}"/>
</apex:pageBlockSectionItem>
<!-- Otherwise, they are verified, show a confirmation message -->
<apex:pageBlockSectionItem rendered="{!verified}">
<p>El código es correcto, presione Enviar</p>
</apex:pageBlockSectionItem>
</apex:pageBlockSection>
</apex:pageBlock>
</apex:form>
</apex:define>
</apex:composition>
</apex:page>
What i'm not able to do is, in one column i wanna put all the fields and in another column add some youtube videos
I understand that your page is not behaving as you expect - what problem are you seeing?
Well i'm not an expert with the coding, but i would like to know is what i'm missing or what i need to do to group the thing in columns
I understand that. However, you are posting a ton of code and not telling us what is going wrong. Can you tell us what problem you are seeing - is the table not appearing, layout is wrong etc.
That's my original code the form is working, in that page i have only one column, my question is, what i need to change in that code to get what i'm looking, the 2 columns with the fields and videos
You'll need to change your pageblocksection to have 2 columns, and then in the body you'll need to alternate between input fields and videos. Something like:
<apex:pageBlockSection title="Solicitud de Información" collapsible="true" columns="2" > <apex:inputField value="{!Lead.FirstName}" label="Nombre (s)" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/> <apex:pageBlockSectionItem> <apex:label value="Video 1" /> <!-- markup to include video goes here --> </apex:pageBlockSectionItem>Thank you Bob! let me try it and i'll post the result, i really appreciate your help!!!
Hello Bob! I change the code like this
<apex:pageBlockSection title="Solicitud de Información" collapsible="true" columns="2" >
<apex:pageBlockSectionItem>
<apex:inputField value="{!Lead.FirstName}" label="Nombre (s)" required="True" style="width: 200px; height: auto; background-color: #E0FFFF" styleclass="input"/>
</apex:pageBlockSectionItem>
<apex:pageBlockSectionItem>
<apex:iframe width="420" height="315" src="http://www.youtube.com/embed/Qd8OtvSgal8"/>
</apex:pageBlockSectionItem>
my page looks like this now... the labels for the fields are missing and now i have fields in both columns.... what i'm doing wrong???
Here is the link of the demo: http://mcmcontacto.desarrollo.cs16.force.com/contacto
Don't put the inputfield inside an apex:pageblocksectionitem - that is why the label has been lost.
The video doesn't have a label - you've just put an iframe in there.
Check my code above - the inputfield is a child of the pageblocksection and I've specified an apex:outputLabel before the video markup.
Ok Bob!
I put in this way
<apex:pageBlockSection title="Solicitud de Información" collapsible="true" columns="2" >
all my input fields
<apex:pageBlockSectionItem>
<apex:outputLabel value="Video 1" />
the video
</apex:pageBlockSectionItem>
But yes, i have my now the two columns, in both are the fields and the video, if i put the code like this
<apex:pageBlockSection title="Solicitud de Información" collapsible="true" columns="2" >
input field
<apex:pageBlockSectionItem>
<apex:outputLabel value="Video 1" />
the video
</apex:pageBlockSectionItem>
input field
<apex:pageBlockSectionItem>
<apex:outputLabel value="Video 2" />
the video
</apex:pageBlockSectionItem>
I get the fields in one column and the videos in the second column... but the space between the fields will depend now of the video size, how can i fix the space between fields????
Any ideas??? thank you guys!!!