You need to sign in to do that
Don't have an account?
JackMckracken83
Noob question - Displaying related records
I've got a tree view of nested categories on the left side of my page - I'd like for the user to be able to click one of the categories and see a list of related videos on the right side of the page. Is there an available snippet or tutorial out there with this type of functionality?
This is actually not as straightforward as you might think. On your tree of categories, you can hook in an onclick javascript event to the element. The onclick event takes the name of the category as an argument. Then, create an ActionFunction that calls a controller method, using the name of the category to find related videos via a SOQL query. Below is an example where the VF page shows a list of Accounts. Clicking on one of the account names will display a list of related Contacts.
Controller
public with sharing class RelatedContacts {
public List<Account> accounts { get; set; }
public String acctName { get; set; }
public List<Contact> relatedContacts { get; set; }
public RelatedContacts() {
accounts = [ select Id, Name from Account ];
}
public PageReference showContacts() {
acctName = ApexPages.currentPage().getParameters().get( 'a' );
relatedContacts = [ select Name, Description from Contact where Account.Name = :acctName ];
return null;
}
}
VF Page
<apex:pagecontroller="RelatedContacts">
<apex:form>
<apex:actionFunction action = "{!showContacts}" name = "showrelatedcontacts" rerender = "contacts">
<apex:param name="a" value="" />
</apex:actionFunction>
<apex:repeat value = "{!accounts}" var = "acct">
<p><a href="#" onclick = "showrelatedcontacts( this.innerHTML );return false;">{!acct.Name}</a></p>
</apex:repeat>
<apex:outputPanel layout = "block" id = "contacts">
<apex:dataTable value = "{!relatedContacts}" var = "s">
<apex:column>
<apex:facet name = "header" />
<apex:outputText value = "{!s.Name}" />
</apex:column>
<apex:column>
<apex:facet name = "header" />
<apex:outputText value = "{!s.Description}"/>
</apex:column>
</apex:dataTable>
</apex:outputPanel>
</apex:form>
</apex:page>
Hope that helps!
~ Clint
All Answers
This is actually not as straightforward as you might think. On your tree of categories, you can hook in an onclick javascript event to the element. The onclick event takes the name of the category as an argument. Then, create an ActionFunction that calls a controller method, using the name of the category to find related videos via a SOQL query. Below is an example where the VF page shows a list of Accounts. Clicking on one of the account names will display a list of related Contacts.
Controller
public with sharing class RelatedContacts {
public List<Account> accounts { get; set; }
public String acctName { get; set; }
public List<Contact> relatedContacts { get; set; }
public RelatedContacts() {
accounts = [ select Id, Name from Account ];
}
public PageReference showContacts() {
acctName = ApexPages.currentPage().getParameters().get( 'a' );
relatedContacts = [ select Name, Description from Contact where Account.Name = :acctName ];
return null;
}
}
VF Page
<apex:pagecontroller="RelatedContacts">
<apex:form>
<apex:actionFunction action = "{!showContacts}" name = "showrelatedcontacts" rerender = "contacts">
<apex:param name="a" value="" />
</apex:actionFunction>
<apex:repeat value = "{!accounts}" var = "acct">
<p><a href="#" onclick = "showrelatedcontacts( this.innerHTML );return false;">{!acct.Name}</a></p>
</apex:repeat>
<apex:outputPanel layout = "block" id = "contacts">
<apex:dataTable value = "{!relatedContacts}" var = "s">
<apex:column>
<apex:facet name = "header" />
<apex:outputText value = "{!s.Name}" />
</apex:column>
<apex:column>
<apex:facet name = "header" />
<apex:outputText value = "{!s.Description}"/>
</apex:column>
</apex:dataTable>
</apex:outputPanel>
</apex:form>
</apex:page>
Hope that helps!
~ Clint
Thanks!