Book Image

Primefaces Cookbook Second Edition

Book Image

Primefaces Cookbook Second Edition

Overview of this book

Related Content you might be interested in

Current Title:

Small book image
Primefaces Cookbook Second Edition
May, 2015 | 412 pages
No titles found
Table of Contents (20 chapters)
PrimeFaces Cookbook Second Edition
PrimeFaces Cookbook Second Edition
Credits
Credits
Foreword
Foreword
Foreword
Foreword
About the Authors
About the Authors
About the Reviewers
About the Reviewers
www.PacktPub.com
www.PacktPub.com
Preface
Preface
Free Chapter
1
Getting Started with PrimeFaces
Getting Started with PrimeFaces
Introduction
Setting up and configuring the PrimeFaces library
AJAX basics with process and update
PrimeFaces selectors
Partial process and update with fragments
Partial view submit
Internationalization (i18n) and Localization (L10n)
Improved resource ordering
2
Theming Concepts
Theming Concepts
Introduction
Understanding structural and skinning CSS
Installing themes
Customizing default theme styles
Adjusting the font and size throughout the web application
Simple ways to create a new theme
Stateless and stateful theme switchers
Integrating Font Awesome with PrimeFaces
3
Enhanced Inputs and Selects
Enhanced Inputs and Selects
Introduction
Formatted input with inputMask
Auto suggestion with autoComplete
Usable features of inputTextArea
Discovering selectBooleanCheckbox and selectManyCheckbox
Choosing a single item with selectOneMenu
Basic and advanced calendar scenarios
Spinner – different ways to provide input
Slider – different ways to provide input
Rich text editing with the editor
Advanced editing with an in-place editor
Enhanced password input
Star-based rating input
4
Grouping Content with Panels
Grouping Content with Panels
Introduction
Grouping content with a standard panel
PanelGrid with colspan and rowspan support
Vertical stacked panels with accordion
Displaying overflowed content with scrollPanel
Working with a tabbed panel
Grouping of buttons and more with toolbar
The multipurpose output panel
Simulating the portal environment with dashboard
Creating complex layouts
Responsive layout with Grid CSS
5
Data Iteration Components
Data Iteration Components
Introduction
Selecting rows in dataTable
Sorting and filtering data in dataTable
In-cell editing with dataTable
Resizing, reordering, and toggling columns in dataTable
Making dataTable responsive
Using subTable for grouping
Handling tons of data – LazyDataModel
Listing data with dataList
Listing data with pickList
Listing data with orderList
Visualizing data with tree
Visualizing data with treeTable
Exporting data in various formats
Managing events with schedule by leveraging lazy loading
Visualizing data with dataScroller
6
Endless Menu Variations
Endless Menu Variations
Introduction
Statically and dynamically positioned menus
Creating programmatic menus
The context menu with nested items
Integrating the context menu
Breadcrumb – providing contextual information about page hierarchy
SlideMenu – menu in the iPod style
TieredMenu – submenus in nested overlays
MegaMenu – the multicolumn menu
PanelMenu – hybrid of accordion and tree
MenuButton – multiple items in a popup
Accessing commands via menubar
Displaying checkboxes in selectCheckboxMenu
7
Working with Files, Images, and Multimedia
Working with Files, Images, and Multimedia
Introduction
Basic, automatic, drag and drop, and multiple file uploading
Downloading files
Cropping images
Creating dynamic image streaming programmatically
Displaying a collection of images with galleria
Displaying a collection of images with imageSwitch
Displaying a collection of images with contentFlow
Embedding the multimedia content in JSF pages
Capturing images with photoCam
8
Drag Me, Drop Me
Drag Me, Drop Me
Introduction
Making a component draggable
Restricting dragging by axis, grid, and containment
Snapping to the edges of nearest elements
Defining droppable targets
Restricting dropping by tolerance and acceptance
AJAX-enhanced drag and drop
Integrating drag and drop with data iteration components
9
Creating Charts and Maps
Creating Charts and Maps
Introduction
Creating line, area, bar, and pie charts
Creating combined charts
Updating live data in charts with polling
Interacting with charts via AJAX
Basic mapping with GMaps
Adding, selecting, and dragging markers in maps
Creating rectangles, circles, polylines, and polygons in maps
Enabling InfoWindow and streetView on maps
10
Client-side Validation
Client-side Validation
Introduction
Configuring and getting started with CSV
Instant validation with p:clientValidator
Bean Validation and transformation
Extending CSV with JSF
Extending CSV with Bean Validation
11
Miscellaneous Advanced Use Cases
Miscellaneous Advanced Use Cases
Introduction
Programmatic updating and scrolling with RequestContext
Two ways of triggering the JavaScript execution
Adding AJAX callback parameters – validation within a dialog
Opening external pages in dynamically generated dialogs
Polling – sending periodical AJAX requests
Blocking page pieces during long-running AJAX calls
Controlling form submission using defaultCommand
Clever focus management in forms
Layout pitfalls of menus and dialogs
Targetable messages with severity levels
Conditional coloring in dataTable
Sticking a component when scrolling
Reducing page load time using content caching
Possibilities for exception handling in PrimeFaces
Index
Index

Grouping content with a standard panel

A generic grouping component for JSF components, panel has features such as toggling, closing, a built-in pop-up menu, and AJAX event listeners. In this recipe, we will create panels that can be closed and toggled, with custom action menus and AJAX behaviors added.

How to do it…

A basic definition of the panel would be as follows:

<p:panel id="simple" header="PrimeFaces" footer="The Cookbook">
  <h:outputText value="Open Source Primefaces is the leading JSF
    Component Suite in the industry, which is adopted widely and
    being used in production ready projects around the globe." />
</p:panel>

The preceding definition of the panel will be rendered as shown in the following image:

There's more…

The header and footer attributes can be used to render text at the top of the panel as the header and at the bottom of the panel as the footer. The values defined for the attributes are escaped by default, so the HTML content can be easily provided...

Previous Section
End of Section 3
Next Section