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.
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.
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.
The core includes all the generic functionality required by the PrimeFaces framework.
scrollTo
or
escapeHTML
.Primefaces.csp.eval
instead of $.globalEval
.@form
on the client.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.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();
}
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.
$.fn
). This includes methods from jQuery plugins added by the various libraries used by PrimeFaces.$
/ jQuery
).JQuery*
. These namespaces are only for the
types and do not contain any objects that are available at runtime.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