Is the API for the PrimeFaces Javascript library (i.e. WidgetVars) available and documented?
I've searched for any documentation related to PrimeJaces widgetVars Javascript components looking for APIs and any related documentation.
I found that although the PF JSF components are well documented in the PF docs , I cannot find anything related to the Javascript Widget Library - how to use or manipulate widgets in JS.
Is there any documentation for this? I found Hatem Alimam's excellent Blog Entry WidgetVar , but I'm looking for something more comprehensive that covers various widgets, methods, and more.
Am I the only choice to read the JS code itself? The code is now hosted on github under src / main / resources / META-INF /. But I don't even know which file to look at.
source to share
For many "base" components that have straight HTML, you can always use the base html api (or jquery copies of them), for example. plain html and 'PrimeFaces instance to read radioButton selection, they are identical. Could this be improved from a more intuitive one PF('mySelectOneRadio').selected()
? Yes, maybe ... (extension request file in github)
Additional functions are documented in the documentation , eg. for selectOneRadio or selectManyMenu .
The name of the widget is also in the documentation, for example. "PrimeFaces.widget.SelectOneRadio" which can be found easily with recursive grep or a decent IDE. And it turns out that the "base" form inputs are in "form.js" including p:selectOneRadio
.
More complex non-ui components have their api also in the documentation and have their own . js files
eg. p:dataTable
api and the appropriate PrimeFaces.widget.DataTable
javascript file file
source to share
I just created the Primefaces widget documentation (below) where I want to show how widgetVar
Javascript works and show the basic functionality.
Right now there is only Datatable available, however I plan to cover all components if it might help.
Note. I take all of the information .js
in the repository GitHub , so the information may be a bit crude.
datatable.js
in the GitHub registry
| Function | More details | | --------- | ------- |
| bindPaginator: function()
| Binds a change listener to an event and makes a paginator |
| loadLiveRows: function()
| Loads lines on the fly while scrolling in real time |
| paginate: function(newState)
| Ajax pagination |
| fetchNextPage: function(newState)
| Loads the next page asynchronously to store it in the viewstate and Updates viewstate |
| sort: function(columnHeader, order, multi)
| Ajax sort |
| filter: function()
| Ajax Filter |
| onRowClick: function(event, rowElement, silent)
| |
| onRowDblclick: function(event, row)
| |
| highlightRow: function(row)
| Selects the row as selected |
| unhighlightRow: function(row)
| Cleans selected images |
| fireRowSelectEvent: function(rowKey, behaviorEvent)
| Sends a server-side rowSelectEvent to call the rowSelectListener, if defined |
| fireRowUnselectEvent: function(rowKey, behaviorEvent)
| Dispatches a rowUnselectEvent server side to call rowUnselectListener, if defined |
| selectRowWithRadio: function(radio)
| Selects the correlation row of the column selection based on radio |
| unselectAllRows: function()
| |
| selectAllRowsOnPage: function()
| |
| unselectAllRowsOnPage: function()
| |
| selectAllRows: function()
| |
| toggleExpansion: function(toggler)
| Expands a string to display detailed content |
| collapseRow: function(row)
| |
| collapseAllRows: function()
| |
| getExpandedRows: function()
| |
| switchToRowEdit: function(row)
| |
| showRowEditors: function(row)
| |
| saveRowEdit: function(rowEditor)
| Saves the edited line |
| cancelRowEdit: function(rowEditor)
| |
| updateRow: function(row, content)
| Updates a row with the given content |
| clearSelection: function()
| Clears the selection state |
| clearFilters: function()
| Clears table filters |
| removeSelection: function(rowIndex)
| Remove the given rowIndex from the selection |
| addSelection: function(rowKey)
| Adds the given rowKey to the selection if it doesn't already exist |
| isSelected: function(rowKey)
| Finds if rowKey is given in selection |
| saveColumnOrder: function()
| |
| isEmpty: function()
| Returns if any data is displayed |
| getSelectedRowsCount: function()
| | |
source to share