-3

I have VF page which get a many text based on the text entered in the multi-picklist values. The field could return 3 or 4 sentence based on the condition I specified in for field which has a formula(Text) data type.

I want to display it as bulletin points in my page. I have the code in VF as:

<div id="container3" style="width:720px">
<p style="font-size:18px;">Objects:style="font-size:18px;"/></p>
<li><apex:outputText value="{!Page__c.Objects__c}" <li>
</div>

Objects__c is a Formula(text) and might return 3 values or 2 or 4 based on the formula condition that I specified.

With this I get output as :

  • Circle Triangle Square Rectangle

However I need to get it like:

  • Circle
  • Triangle
  • Square
  • Rectangle

Each as a bullet point.

------edited ------

So I just recreated my problem into a simpler form, but people have asked to share the actual code, thus here is my code:

<apex:page standardController="Plan_Reviews__c" showHeader="false" extensions="BuildingProCertObjectionSheet" sidebar="true">
<apex:form >
<apex:image url="{!imageURL}" style="width:720px" ></apex:image>

 <apex:panelGrid columns="2" width="720px">

   <apex:panelGrid columns="2" width="60%">
   <h1 style="font-size:20px;"> PRO-CERT CHECKLIST</h1><br></br>
         <!--  <p style="font-size:18px;">FPIMS:</p> <apex:outputText value="{!Plan_Reviews__c.FPIMS__c}" style="font-size:18px;"/>-->

           <p style="font-size:18px;">Premise: <apex:outputText value="{!Plan_Reviews__c.Establishment_Address__c}" style="font-size:18px;"/></p>

   </apex:panelGrid>
   <apex:panelGrid columns="2" width="40%">         
           <p style="font-size:18px;">Date:<apex:outputText value="{!currentdate}" style="font-size:18px;"/></p>
   </apex:panelGrid>
   <apex:panelGrid columns="2" width="60%">
           <p style="font-size:18px;">DOB Job Number:</p><apex:outputText value="{!Plan_Reviews__c.DOB_Job_Number__c}" style="font-size:18px;"/>     
           <!--<p style="font-size:18px;">Name of Contractor:<apex:outputText value="{!Plan_Reviews__c.Contractor_Name__r.Name}" style="font-size:18px;"/></p>-->
   </apex:panelGrid>
</apex:panelGrid>  

<div id="container1" style="width:720px">
  <p  style="font-size:18px;">TO WHOM IT MAY CONCERN:</p>
  <p style="font-size:18px;">Plans submitted to this office have been examined and found to be unacceptable for an inspection and test at this time. The plan will be re-examined after the following defects are corrected:</p>
</div>

<div id="container2" style="width:720px">
 <apex:repeat value="{!objlist}" var="d">
    <tr>
    <td><apex:outputText value="{!d}" style="font-size:18px;" /></td><br></br>
    </tr>
 </apex:repeat>
</div>

<div id="container3" style="width:720px">

    <p style="font-size:18px;">Pro Cert Objection:</p>
     <li><apex:outputText value="{!Plan_Reviews__c.Pro_Cert_Objections_for_Letter__c}" style="font-size:18px;"/></li>
    <p style="font-size:18px;">Other Objection:<apex:outputText value="{!Plan_Reviews__c.Other_Violations__c}" style="font-size:18px;"/></p>
   <!-- <p style="font-size:18px;">By Order of Chief of Fire Prevention<br></br> 
    By&nbsp;<apex:outputText value="{!Plan_Reviews__c.Assigned_Reviewer_Title__c}"/>&nbsp;<apex:outputText value="{!Plan_Reviews__c.Assigned_Reviewer_s_Email__c}"/></p> -->
</div>

<apex:commandButton action="{!Savecopy}" disabled="false" value="Save"/>

</apex:form>
</apex:page>

I have Pro_Cert_Objections_for_Letter__c as Formula(Text) and below is formula I use:

IF(INCLUDES(Pro_Cert_Objections__c, "Missing $210 FS PR Fee"), "Missing fire suppression plan review fee of $210.00 (to be paid at DOB borough office);", null) & 
IF(INCLUDES(Pro_Cert_Objections__c, "Missing TMR-2"), "Missing required TMR-2 application form;", null) & 
IF(INCLUDES(Pro_Cert_Objections__c, "TMR-2 missing FS contractor"), "Submitted TMR-2 application form does not identify registered fire suppression contractor;", null) & 

So if the condition fails I get a null return and the null appears in new bullet point. I do not want a bullet point for NULL . How can I put only valid text in list and not NULL.

3
  • Can you update your question with your formula as well?
    – Jenny B
    Sep 23, 2015 at 22:27
  • how do you separate items in Objects__c formula?
    – pnoytechie
    Sep 23, 2015 at 23:58
  • Please see the edit.
    – SfdcBat
    Sep 24, 2015 at 15:06

2 Answers 2

1

You can do it through javascript. Split the string and create a <li> list and add it to the page. Here is how you can do this.

<apex:page standardController="Book__c" showHeader="false" sidebar="false">
    <div id="container3" style="width:720px">
        <ul id="ul-test"></ul>
    </div>
    <script type="text/javascript">
        var inputText = "{!Book__c.Objects__c}";
        console.log(inputText);
        var arrinputText = inputText.split(' '),
        ul = document.getElementById("ul-test");

        for (var i = 0, len = arrinputText.length; i < len; i++) {
            var li = document.createElement("li");
            var text = document.createTextNode(arrinputText[i]);
            li.appendChild(text);
            ul.appendChild(li);
        }       
    </script>   
</apex:page>

In this exaple {!Book__c.Objects__c} returns Circle Triangle Square Rectangle.

The out put is

  • Circle
  • Triangle
  • Square
  • Rectangle

Updated code

<apex:page standardController="Plan_Reviews__c" showHeader="false" extensions="BuildingProCertObjectionSheet" sidebar="true">
<apex:form >
<apex:image url="{!imageURL}" style="width:720px" ></apex:image>

 <apex:panelGrid columns="2" width="720px">

   <apex:panelGrid columns="2" width="60%">
   <h1 style="font-size:20px;"> PRO-CERT CHECKLIST</h1><br></br>
         <!--  <p style="font-size:18px;">FPIMS:</p> <apex:outputText value="{!Plan_Reviews__c.FPIMS__c}" style="font-size:18px;"/>-->

           <p style="font-size:18px;">Premise: <apex:outputText value="{!Plan_Reviews__c.Establishment_Address__c}" style="font-size:18px;"/></p>

   </apex:panelGrid>
   <apex:panelGrid columns="2" width="40%">         
           <p style="font-size:18px;">Date:<apex:outputText value="{!currentdate}" style="font-size:18px;"/></p>
   </apex:panelGrid>
   <apex:panelGrid columns="2" width="60%">
           <p style="font-size:18px;">DOB Job Number:</p><apex:outputText value="{!Plan_Reviews__c.DOB_Job_Number__c}" style="font-size:18px;"/>     
           <!--<p style="font-size:18px;">Name of Contractor:<apex:outputText value="{!Plan_Reviews__c.Contractor_Name__r.Name}" style="font-size:18px;"/></p>-->
   </apex:panelGrid>
</apex:panelGrid>  

<div id="container1" style="width:720px">
  <p  style="font-size:18px;">TO WHOM IT MAY CONCERN:</p>
  <p style="font-size:18px;">Plans submitted to this office have been examined and found to be unacceptable for an inspection and test at this time. The plan will be re-examined after the following defects are corrected:</p>
</div>

<div id="container2" style="width:720px">
 <apex:repeat value="{!objlist}" var="d">
    <tr>
    <td><apex:outputText value="{!d}" style="font-size:18px;" /></td><br></br>
    </tr>
 </apex:repeat>
</div>

<div id="container3" style="width:720px">

    <p style="font-size:18px;">Pro Cert Objection:</p>
    <ul id="ul-obj-letters" style="font-size:18px;"></ul>
    <p style="font-size:18px;">Other Objection:<apex:outputText value="{!Plan_Reviews__c.Other_Violations__c}" style="font-size:18px;"/></p>
   <!-- <p style="font-size:18px;">By Order of Chief of Fire Prevention<br></br> 
    By&nbsp;<apex:outputText value="{!Plan_Reviews__c.Assigned_Reviewer_Title__c}"/>&nbsp;<apex:outputText value="{!Plan_Reviews__c.Assigned_Reviewer_s_Email__c}"/></p> -->
</div>

<apex:commandButton action="{!Savecopy}" disabled="false" value="Save"/>

</apex:form>
    <script type="text/javascript">
        var inputText = "{!Plan_Reviews__c.Pro_Cert_Objections_for_Letter__c}";
        console.log(inputText);
        var arrinputText = inputText.split(' '),
        ul = document.getElementById("ul-obj-letters");

        for (var i = 0, len = arrinputText.length; i < len; i++) {
            var li = document.createElement("li");
            var text = document.createTextNode(arrinputText[i]);
            li.appendChild(text);
            ul.appendChild(li);
        }       
    </script>
</apex:page>
12
  • Sorry , it did not work this way. I have sHowHeader="false" to make it view able in a new page tab. If I make it as true it appears on the salesforce interface itself. I have this in <div id="container3" style="width:720px"> <ul id="ul-test"></ul></div>. Do I have to make any change to get element by id?
    – SfdcBat
    Sep 24, 2015 at 14:46
  • I have made showHeader="false" sidebar="false" and <div id="container3" style="width:720px"> <ul id="ul-test"></ul> </div> and it is working for me. I have updated the solution. Can you please update your question with complete VF page code?
    – Saroj Bera
    Sep 24, 2015 at 15:00
  • Please see the edit. I have included my actual code in here.
    – SfdcBat
    Sep 24, 2015 at 15:06
  • I coul not find apex:outputText value="{!Page__c.Objects__c}". Can you please let me know if apex:outputText value="{!Plan_Reviews__c.Pro_Cert_Objections_for_Letter__c}" is same?
    – Saroj Bera
    Sep 24, 2015 at 15:12
  • I renamed Plan_Reviews__c.Pro_Cert_Objections_for_Letter__c to Page__c.Objects__c just renamed the variable names to suit the problem which I described. But actually the name is Plan_Reviews__c.Pro_Cert_Objections_for_Letter__c
    – SfdcBat
    Sep 24, 2015 at 15:15
0

Try this:

<div id="container3" style="width:720px">
<p style="font-size:18px;">Objects:style="font-size:18px;"/></p>

    <apex:repeat value="{!Page__c.Objects__c}" var="string" id="theRepeat">

        <li><apex:outputText value="{!string}" id="theValue"/></li>

    </apex:repeat>

</div>
2
  • Sorry it did not work this way! I still get everything in one line
    – SfdcBat
    Sep 23, 2015 at 21:04
  • I think you should use a controller to get the value of Page__c.Objects__c and do the following: String.split(Page__c.Objects__c, ' ') It will return an array, then you should call the array in your VF Page. And replace the repeat value with your variable in your controller. Sep 23, 2015 at 22:50

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .