Salesforce Developer Community

David Kingery 3
NEWBIE
0 Points
Member since 2017

Chatter

Feed
0

Best Answers
0

Likes Received
0

Likes Given
1

Questions
5

Replies

How to restrict the width of a multi-picklist inputField on a Visualforce page (standard controller)

Multi-picklist is too wide to fit on the visual force page

So, I have a Visualforce page that's more or less replacing the entire record page for several reasons, mostly to conditionally show/hide fields.

There's about a hundred or so <apex:inputField> tags, of picklist, text, and multipickist types. Many of the picklist and multipicklist have very long answers, so the width of the field dynamically expands beyond the borders edges of the Visualforce page, and even off my end user's low-resultion laptop screens.

I've tried replacing them with <apex:selectList> and <apex:selectCheckboxes>, but besides other formatting issues, these won't update the SObject via the standard controller as needed (value needs to be "{!Custom_Object__c.Custom_Field__c}", or else load/save and show/hide functionality won't work).

I've tried style="width:40px" and style="width:10%" (with different values) and the markup seems to ignore them altogether.

How do I force a multipicklist to stay within the boudaries of it's visualforce page?

David Kingery 3
July 13, 2017
Like
0

2 replies

How to restrict the width of a multi-picklist inputField on a Visualforce page (standard controller)

David Kingery 3
July 13, 2017
Like
0

4 replies

Help with styling a multi-select picklist in an inputField

I'm having trouble styling a multi-select list properly in my markup. My table is as show below:

<apex:pageBlockTable value="{!component}" var="none" >
          			<apex:column headervalue="What extra features does the windshield have? (select all that apply):" style="text-align:center;">
          				<apex:inputField value="{!component.Windshield_Features__c}"/>
          			</apex:column>
          		</apex:pageBlockTable>

I simply want to increase the number of visible lines displayed to the user, as at the moment it is quite condensed. I've made the defalut value of the field 10, but it won't reflect that here. I've tried the style="size: 10" but that has no effect either. The only thing which seems to work is style="height:100px". However, that also enlarges the size of the selection buttons to the point that they look awful so I'm hoping someone knows a way to change the sizes independently because I even tried a styleClass to set the height but for some reason that only affected the button size rather than the table height.

Carter85
November 06, 2014
Like
0

2 replies

how decrease the width of picklist field?

By default picklist will display values with width 5. But i want to decrease the width of that field.

I am entering numbers from 1 to 20 in picklist field. The picklist field width should be 2 only so that the values will fit into the field. How to achieve this one

Thanks in advance....Regards

-----------------------------------------

Ranjith

ranjith kumar
May 23, 2012
Like
0

SOLVED

6 replies

Conditionally make field required and rendered

I want to implement the following logic:

If A == 'Off', then don't display inputField;

if A == 'On', then display inputField but make inputField not required

If A=='On/Required', then display inputField and make inputField required

I have the following code:

<apex:inputField value="{!B}" required="{IF(A =='On/Required', true, false)}" rendered="{!A != 'Off'}" />

It doesn't work. Can anyone point out where it went wrong?

Thanks in advance,

Cable Guy.ax375
August 10, 2010
Like
0

SOLVED

5 replies

How can I change the width / height of an apex:inputField on a VisualForce page?

I'm writing a VisualForce wizard that collects a list of hardware items (RMA_Return__c) being returned by a customer. In the VF page, I'd like to control the height and width of the Problem Description field.

Picture is worth a thousand words:

I want to reduce the size of the left InputField box, and increase the width and height of the second InputField box.

It looks like <apex:inputText> has a "size" attribute, so you can specify the width of the inputText box, but there isn't a similar attribute for the <apex:inputField> component.

There is a "style" attribute, but I'm don't know what CSS syntax would allow me to control this.

NOTE: Still a work in progress, kindly excuse the code hacks here.

Current VisualForce Page:

Code:

<!-- Create RMA Wizard: Step 2 for Defect / ECO Recall / Shipment Error RMA types -->
<apex:page controller="newRmaController" tabStyle="RMA__c">
  <apex:sectionHeader title="New RMA" subtitle="Step 2 : Select Returning Hardware"/>
  <apex:form >
    <apex:pageBlock title="RMA Detail" mode="edit">
      <apex:pageBlockButtons >
        <apex:commandButton action="{!step1}" value="Previous"/>
        <apex:commandButton action="{!step2}" value="Next"/>
      </apex:pageBlockButtons>
      <apex:pageBlockSection title="RMA Information">
        <apex:inputField id="rmaType" value="{!Rma.Type__c}" required="TRUE"/>
        <apex:inputField id="caseNumber" value="{!Case.casenumber}" />
        <apex:inputField id="caseSwitch" value="{!Case.Switch__c}" required="TRUE"/>
        <apex:inputField id="caseAccount" value="{!Case.Accountid}" required="TRUE"/>
      </apex:pageBlockSection>

      <table width="100%"><tr valign="top">
         <td width="70%">
            <apex:pageBlockSection title="List All Returning Hardware and Reason for Return" columns="1">
               <apex:repeat value="{!RMA_Returns}" var="rtn">
                  <tr>
                     <td width="30%"> <apex:inputField value="{!rtn.SN__c}"/> </td>
                     <td witdh="70%"> <apex:inputField value="{!rtn.Problem_Description__c}"/> </td>
                  </tr>
               </apex:repeat>
               <apex:commandLink action="{!addReturn}" value="Add Card"/>
            </apex:pageBlockSection>
         </td>
         <td width="30%">
            <apex:pageBlockSection title="Installed HW as of Last SAT Audit" columns="1">
               <apex:dataTable id="c3HardwareList" value="{!c3HardwareList}" var="hw" bgcolor="#F3F3EC"
                styleClass="list" rowClasses="dataRow" onRowMouseOver="hiOn(this);" onRowMouseOut="hiOff(this);">
                  <apex:column >
                     <apex:facet name="header"><b>S/N</b></apex:facet>
                     <apex:outputLink value="/{!hw.id}">
                        {!hw.name}
                     </apex:outputLink>
                  </apex:column>
                  <apex:column >
                     <apex:facet name="header"><b>Product Code</b></apex:facet>
                        {!hw.Product_Code__c}
                  </apex:column>
               </apex:dataTable>
            </apex:pageBlockSection>
      </td></tr></table>
      <apex:pageBlockSection title="Ship-To Information : Verify with Customer for Accuracy" collapsible="TRUE" columns="2">
          <apex:inputField id="rmaContact" value="{!Switch.RMA_Contact__c}" />
          <apex:inputField id="rmaPhone" value="{!Switch.RMA_Phone__c}" />
          <apex:inputField id="rmaStreet" value="{!Switch.RMA_Street__c}" />
          <apex:inputField id="rmaCity" value="{!Switch.RMA_City__c}" />
          <apex:inputField id="rmaState" value="{!Switch.RMA_State_Region__c}" />
          <apex:inputField id="rmaZip" value="{!Switch.RMA_Zip_Code__c}" />
          <apex:inputField id="rmaCountry" value="{!Switch.RMA_Country__c}" />
      </apex:pageBlockSection>
    </apex:pageBlock>
    Help: http://forums.sforce.com/sforce/board/message—board.id=Visualforce&message.id=668
  </apex:form>
</apex:page>

JPSeabury
November 08, 2008
Like
1