1

I am creating a visualforce page component to go on the Account Page that will display all related Sales_History__c records. I would like to include a drop down that will allow the end user to select the year to view. This does not have to be a drop down, it could be an input as well.

EDIT

Okay so here is what I have right now.

Controller:

public class SalesHistoryOverviewController {
public Id AccountId { get; set; }

public String SelectedYear { get; set; }
public List<SelectOption> Options { get; set; }

public SalesHistoryOverviewController() {
    SelectedYear = '2017';

    Options = new List<SelectOption>();

    Options.add(new SelectOption('2017', '2017'));
    Options.add(new SelectOption('2016', '2016'));
    Options.add(new SelectOption('2015', '2015'));
    Options.add(new SelectOption('2014', '2014'));
    Options.add(new SelectOption('2013', '2013'));
    Options.add(new SelectOption('2012', '2012'));
    Options.add(new SelectOption('2011', '2011'));
}

public List<Sales_History__c> Sales_Histories {
    get {
        return [SELECT Id, Name FROM Sales_History__c WHERE Account_Name__c = :AccountId AND CALENDAR_YEAR(Sale_Date__c) = :Integer.valueOf(SelectedYear)];
    }
}

public PageReference Rerender() {
    return null; 
}
}

Component:

<apex:component controller="SalesHistoryOverviewController">
<apex:attribute name="id_param" assignTo="{!AccountId}" description="..." type="String" required="true"/>

<apex:outputPanel id="componentPanel">
    <apex:form>
        <apex:selectList value="{!SelectedYear}" multiselect="false">
            <apex:selectOptions value="{!Options}"/>
        </apex:selectList>

        <apex:commandButton value="Filter Records" action="{!Rerender}" rerender="componentPanel" />

    </apex:form>

    <apex:dataList value="{!Sales_Histories}" var="s">
        <apex:outputText value="{s.Name}"/>
        <apex:outputText value="{s.Account_Name__c}"/>
        <apex:outputText value="{s.Invoice_Number__c}"/>
        <apex:outputText value="{s.Sale_Date__c}"/>
        <apex:outputText value="{s.Grand_Total__c}"/>
    </apex:dataList>

</apex:outputPanel>

Page:

<apex:page standardController="Account">
<s.SalesHistoryOverviewComponent id_param="{!Account.Id}" />
</apex:page>

I put the page on an Account Page Layout and nothing is showing. Not sure where I am going wrong here.

  • 2
    What have you tried so far? Where are you stuck? You will likely need to use an extension to implement this functionality. – Adrian Larson Mar 7 '17 at 19:02
  • I haven't tried much yet. I have been doing some googling and can't seem to come up with anything. I have the VF page created and I can filter the related list from the back end. I just don't know how to open it up to user editing on the front end. – cmmoutes13 Mar 7 '17 at 19:22
  • Have you been able to implement VF page with Sales_History__c records? – Mahmood Mar 7 '17 at 19:48
  • Yes, I am just looking to be able to filter by the year of the Sale_Date__c column. – cmmoutes13 Mar 7 '17 at 20:09
  • 1
    @cmmoutes13 - Not sure what you mean by "Open it up to editing". All you need is an input field/element on the page and a controller that will display the data. It works just like any other VF page. Note that you can get the Account Id by using the getId() method of the standardController class. When it is displayed inline the user can interact with it – Eric Mar 7 '17 at 20:55
1

Since work was slow this morning, I wrote a basic component, controller, and page, which works as a basic implementation of what you're looking for.

The concept is simple- create a component which accepts an id, and provides data on the page filtered with that id, put that component on a page which has a standard controller of the type you need, provided the id to the component, and then add that visualforce page to the object layout.

The component filtering is fairly simple, it takes advantage of the selectList tag to create a picklist, using the SelectOption list created in the controller as the options for the picklist. Whichever picklist value is selected gets assigned to the variable in the value attribute when the form is submitted to the server. This component also refreshes the page when this happens, causing the Contacts variable to execute some soql and filter the records before displaying them on the page.

SomeController

public class SomeController {

    // Passed in by component, used to filter contacts
    public Id AccountId { get; set; }

    // Set by selectList
    public String SelectedYear { get; set; }
    public List<SelectOption> Options { get; set; }

    public SomeController() {
        // Define a default year - should be something like "Date.today().Year()"
        SelectedYear = '2017';

        // Create a list of SelectOptions to be used in the SelectList as options
        // This list could also be generated by finding the first and last years that contacts were created and filling in the rest 
        Options = new List<SelectOption>();

        Options.add(new SelectOption('2017', '2017'));
        Options.add(new SelectOption('2016', '2016'));
        Options.add(new SelectOption('2015', '2015'));
    }

    /** Variable to fetch cotacts- could also query all relevant records, and use filter on data in the component instead of running soql **/
    public List<Contact> Contacts {
        get {
            return [SELECT Id, Name FROM Contact WHERE AccountId = :AccountId AND CALENDAR_YEAR(CreatedDate) = :Integer.valueOf(SelectedYear)];
        }
    }

    /** Rerender the page to display the update filter data - could also run something like this using the onChange event of the selectList **/ 
    public PageReference Rerender() {
        return null; 
    }
} 

SomeComponent

<apex:component controller="someController">
    <!-- Assign a provided id to the AccountID variable -->
    <apex:attribute name="id_param" assignTo="{!AccountId}" description="..." type="String" required="true"/>

    <!-- Panel to rerender to show data -->
    <apex:outputPanel id="componentPanel">
        <apex:form>
            <!-- Our picklist with the created options from the controller  -->
            <apex:selectList value="{!SelectedYear}" multiselect="false">
                <apex:selectOptions value="{!Options}"/>
            </apex:selectList>

            <!-- A button to filter the records by refreshing the page and submitting the selected year to the controller -->
            <apex:commandButton value="Filter Records" action="{!Rerender}" rerender="componentPanel" />

        </apex:form>

        <!-- Data list to store all data provided from the Contacts variable - which should be filtered by the SelectedYear -->
        <apex:dataList value="{!Contacts}" var="c">
            <apex:outputText value="{!c.Name}"/>
        </apex:dataList>

    </apex:outputPanel>

</apex:component>

SomePage

<apex:page standardController="Account">
    <c:someComponent id_param="{!Account.Id}" />
</apex:page>

When all's said and done, you should have a visualforce page on your page layout that looks something like this:

List of accounts, with a button "filter", and a list of select options displayed.


As an aside, try to write your own component before asking a question like this. Being able to say, "This is my component, but I'm having trouble getting x to do y", makes the question much easier to answer, and increases the chances of you getting a quality answer. If you're ever entering a new area of Salesforce development, try the Relevant Trailhead and create a minimal example before asking.

| improve this answer | |
  • Edited my original post – cmmoutes13 Mar 8 '17 at 17:00
  • Can you see the selectList, or the commandButton? Have you checked the make sure theres data for the selected year? What does the page look like if you view it off the layout? – battery.cord Mar 8 '17 at 17:14
  • When viewing the page on an Account it appears blank. In setup if I click view page it also appears blank. – cmmoutes13 Mar 8 '17 at 19:01
  • You stated that I could make it so the options displayed would only be the options that are available. Can you tell me how I could do that? – cmmoutes13 Mar 8 '17 at 20:02
  • My other thought is that I would like to have an All selection that would display all records regardless of the year. – cmmoutes13 Mar 8 '17 at 20:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.