Skip to content

Flexible and highly customizable Visualforce table grid component. Salesforce.com Classic Look and Feel.

License

Notifications You must be signed in to change notification settings

rsoesemann/visualforce-table-grid

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

75 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Visualforce TableGrid

Deploy to Salesforce

Usage | Know Issues/Todos | Third Party Code | Licence

TableGrid is a free, open-source Force.com library, that provides users and developers a highly customizable, native-looking, sortable, filterable, editable Grid Visualforce component. This component can be used as an advanced, highly configurable (by developer and user) replacement of apex:pageBlockTables and Standard Related Lists.

Two instances of Visualforce TableGrid, one read-only and one editable version.

Features:

  • Native Salesforce.com Look And Feel
  • Works as Standalone table grid or as an embedded replacement for Related List
  • Works as replacement for Standard Lookup popups with <c:advancedLookup>
  • Works for Standard and Custom SObjects
  • Spreadsheet-like Cell-Editing
  • Delete Muliple records
  • Pagination with cutomizable page size
  • Filter Builder UI to let users filter records
  • Field Selection UI to let users customize columns
  • Each user`s customizations can be auto-saved in a "database-cookie"

Usage Examples

Please see components/tableGrid.component for a detailed description of all attributes. The following examples should give you enough information to get started.

TableGrid in a standalone Visualforce page

TableGrid in List mode with Customizations turned on

This snippet is taken from the sample page pages/tableGridStandalone.page.

    <apex:page showHeader="false" sidebar="false"> 
    	<apex:form >
    		...
		    <c:tableGrid type="Opportunity" 
	        			 title="Opportunities"
	                     fields="Name,StageName,Amount,CloseDate" 
	                     sortBy="Name" 
	                     image="/img/icon/hands24.png"
	                     sortDescending="true"
	                     mode="list"
	                     customizeFields="true"
	                     customizeFilter="true"
	                     pageSize="5" />   
	    	 ...
	   	</apex:form>
	</apex:page>

TableGrid embedded into Standard Page Layouts

Two TableGrid instanced replacing Standard Related Lists in a Standard Page Layout

This snippet is taken from the sample page pages/tableGridRelatedList.page and pages/tableGridEmbedded.page

	<apex:page standardController="Account"> 
	    <apex:form>
	        ...
	        
	        <!-- Advanced Related list -->
	        <c:tableGrid type="Contact" 
	                     fields="Id, Name, Email, Birthdate" 
	                     filter="AccountId = `{!Account.Id}`"
	                     title="Contacts" 
	                     gridPageId="readonly"
	                     pageSize="5"
	                     mode="list"/>
	             
	        <!-- Editable grid with customization turned on -->        
	        <c:tableGrid type="Opportunity" 
	                     fields="Name,StageName,Amount,CloseDate" 
	                     filter="AccountId = `{!Account.Id}`"
	                     sortBy="Name" 
	                     sortDescending="true"
	                     title="Opportunities" 
	                     gridPageId="editable"
	                     customizeFields="true"
	                     customizeFilter="true"
	                     pageSize="5"
	                     mode="edit"/>  
	                        
	    	 ...
	   	</apex:form>
	</apex:page>

TableGrid as an Advanced Lookup Popup

TableGrid as an Advanced Lookup Popup

This snippet is taken from the sample page pages/tableGridAdvancedLookup.page.

<apex:page standardController="Contact">    
    <apex:form>
    	...
	    <c:advancedLookup > 
	        <apex:inputField value="{!Contact.AccountId}" label="" />
	    </c:advancedLookup>
	    ...
	</apex:form>
</apex:page>

Known Issues/Todos

  • Performance (loading, partial rerender, select rows,...)
    • Reduce Viewstate
    • Replace ActionSupport with Javascript Remoting
    • Reduce Markup-Size
  • Allow for more than 10.000 result records: For pagination I am using the StandardSetController, which seems to have this restriction.
  • Allow to filter also for read-only fields in FilterBuilder without loosing the context-sensitive input fields.
  • Optionally replace pagination with Infinite Scroll.
  • Fix Bugs:
    • FilterBuilder does not clear value field when switching field
    • Save/Delete selected buttons are not activated when checkbox is selected
    • ...

Third-party Code

This library makes use of a number of third-party components:

About

Flexible and highly customizable Visualforce table grid component. Salesforce.com Classic Look and Feel.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages