Visualforce Table with Alphabet Filter and Sortable Columns

16 Feb

This Visualforce page contains apex:pageBlockTable to demonstrate a few different concepts.

  • Sortable Columns in an apex:pageBlockTable
  • Alphabet Filter that filters on the current sorted column
  • Use of the ApexPage StandardSetController
  • Selecting an individual record in the table using a link
  • Selecting multiple records with a column of checkboxes using a Sub Class(Wrapper Class) to hold the boolean value.

Both single and multiple record selection were included for demonstration. Most actual projects would only require one type, and I thought it would be easy to cut whatever was not needed. The search for the Billing Address fields was consolidated into one field to make the interface simpler. Below is an example of what the Visualforce table looks like with the alphabet filter, sorted columns, address search, and checkbox record selection.

Sortable apex:pageBlockTable, alphabet filter, checkbox selection and link selection
Continue reading

Visualforce Datepicker Manipulation and Day of Week Display

18 Dec

datepicker with past years and no date link

Hide the Datepicker Link for the Current Date

Show Years Before the Current Year in a Datepicker

Development would be a lot harder without stackexchange and stackoverflow. Thanks for this post that illustrated how to do this.
http://salesforce.stackexchange.com/questions/7944/standard-datepicker-year-values

Show a Datepicker on a Text Field

Thanks to these sources for the help figuring this out.
DeveloperForce Boards
Infallibletechie.com

Show the Day of Week When a Date is Selected

The day of week is found by converting the input date into a datetime. Then we use the format method to give us the day of the week spelled out.

day of week spelled out

Code Examples

The examples below show how to remove the date link, show prior years in the datepicker, and add a datepicker to an field.

ExamplePageController.cls

ExamplePage.page

Visualforce Help Text and a Popup Tool Tip

21 Oct

Visualforce Field Help Text

The help icon can be added to a Visualforce field within an apex:pageBlockSectionItem. Access the help text using the $ObjectType api. Put it in the helptext attribute of the apex:pageBlockSectionItem.

Easy Hover Tooltip

The following may help if you are not using the apex:pageBlockSectionItem. I’ve used this technique in the past to put help text on an image in a apex:pageBlockTable and on plain text in a page.

Example:

Hover Over Me
your message here


Thanks to www.kollermedia.at/archive/2008/03/24/easy-css-tooltip/ for providing an easy way to add tooltip help. He does it by putting the style on the link tag instead of the div.

March 16, 2014: Here is another tutorial that explains how to do a popup tool tip. Tutsplus – Tooltip