Options
All
  • Public
  • Public/Protected
  • All
Menu

PrimeFaces JavaScript API Docs

JavaScript API Docs for PrimeFaces

This is the documentation for the client-side JavaScript part of PrimeFaces, please visit PrimeFaces.org for more information. You may also be interested in the user guide.

PrimeFaces Logo

Type declarations file

To enable code autocompletion or type checking etc, a type declaration file (*.d.ts) is available as well via NPM:

# via npm
npm install -D primefaces

# via yarn
yarn add -D primefaces

To use the declarations, either add a triple-slash directive:

/// <reference types="primefaces" />

Or add it to the compiler settings in your tsconfig.json:

{
"compilerOptions": {
"types": ["primefaces"]
}
}

You can also view the declarations file here: main and sub

PrimeFaces is a global library that adds methods and constants in the global window scope. To use the type declarations in a JavaScript or TypeScript file, use a triple-slash directive like this (must be at the top of the file):

/// <reference path="./path/to/PrimeFaces.d.ts" />

// Now your IDE or transpiler can issue a warning that "search" does
// not exist on a jQuery object. You also get autocompletion.
PF("dataTable").jq.search("tbody td");

Make sure the PrimeFaces-module.d.ts is in the same directory. See the TypeScript page for more info on type declaration files.

API Overview

The main entry point of the PrimeFaces client-side JavaScript API is the global object window.PrimeFaces (or just PrimeFaces for short). It contains several utility methods as well as the widget registry with all available PrimeFaces widgets.

Core

The core includes all the generic functionality required by the PrimeFaces framework.

  • PrimeFaces The global object itself contains some utility methods, such as scrollTo or escapeHTML.
  • PrimeFaces.ajax The AJAX module with functionality related to AJAX requests. These requests are made, for example, when a form or a component is updated.
  • PrimeFaces.clientwindow The module for enabling multiple window support in PrimeFaces applications.
  • PrimeFaces.csp Functions for enabling CSP. For example, to use CSP you must use Primefaces.csp.eval instead of $.globalEval.
  • PrimeFaces.dialog The dialog module for working with dialogs.
  • PrimeFaces.expressions The search expressions module. It contains some methods to resolve search expressions such as @form on the client.
  • PrimeFaces.resources The resources submodule. It contains some methods to generate JSF resource URLs.
  • PrimeFaces.settings The settings module which contains the locale (translations) shared by all widgets.
  • PrimeFaces.utils The utility module with more advanced utility methods.
  • PrimeFaces.validation The validation submodule. It contains methods for handling client side validation.

Widgets

  • PrimeFaces.widget contains all available widget classes. A widget is usually instantiated by PrimeFaces, but you may use this, for example, to check the type of a widget instance via instanceof. You can also use these as a base class when you create your own widgets.
  • PrimeFaces.widgets is an object with all instantiated widgets that are available on the current page.
  • window.PF is a method for finding a widget by its widget variable. When the widget does not exist, it logs a warning.

For example, if you have got a data table widget defined in your XHTML view like this:

<p:dataTable id="table" widgetVar="tableVar" />

Then you can access the widget instance from JavaScript like this:

// Find the widget instance
var widget = PF("tableVar");
// Check whether it is really a data table
if (widget instanceof PrimeFaces.widget.DataTable) {
// Do something with the data table
widget.unselectAllRows();
}

JQuery extensions

PrimeFaces relies heavily on JQuery for interacting with the DOM. Many JQuery plugins are included that are used by the various widgets. You can make use of these plugins, but please note that they are not parts of the officially supported API and may be removed or replaced at any time.

Also, as most JQuery plugins are specific to a certain widget, please note that some plugins may only be available when that widget is included in the page.

  • See the JQuery interface for methods that can be called on JQuery instances ($.fn). This includes methods from jQuery plugins added by the various libraries used by PrimeFaces.
  • See the JQueryStatic interface for constants and methods available on the global JQuery object ($ / jQuery).
  • See the TypeToTriggeredEventMap for additional events defined by JQuery extensions.
  • Convention for JQuery plugins for which the type declarations are provided by PrimeFaces: Types and interfaces required by the JQuery extension are declared in a their own namespace JQuery*. These namespaces are only for the types and do not contain any objects that are available at runtime.

Third-party libraries

PrimeFaces makes use of many third-party libraries for providing advanced features, such charts and masked inputs. Many of these do not have typescript declarations. But fear not, PrimeFaces added them for you. For your convenience, the API docs for all third-party libraries are included in this documentation.

Please note that these third-party libraries may be exchanged at any time by a different library.

Many third-party libraries are jQuery plugins, see JQuery and JQueryStatic. Other libraries used by PrimeFaces include:

Generated using TypeDoc