Get reference to PrimeFaces widgetVar with JQuery

Question

I have a group primefaces checkboxes (p:selectBooleanCheckbox) each of them has a defined widgetVar ( widgetVar="rowCheckbox_0" , widgetVar="rowCheckbox_1" , widgetVar="rowCheckbox_2" ,.. ). I would like to get a reference to them and check them with JQuery, but I'm novice and I don't know exactly how to do that.

This is the function that I wrote to get a checkbox reference:

function selectAllCheckbox() {
    var test = $(PrimeFaces.widgets.rowCheckbox_0);
    if (test.length){
        alert('Element found ');
    }
    else {
        alert('Element NOT found');
    }
}

If I execute the code the alert tells me "element found" so I suppose I'm on the right way. Now I don't know how:

1) Execute the .check() function on the element "test" (that should be referred to the first checkbox).

2) Obtain an array containing all the checkboxes references (the "$PrimeFaces.widgets." that starts with "rowCheckbox_" ) Anyone could help me?

Answer 1

You can iterate over the current page widgets and test if the current element is instance of PrimeFaces.widget.SelectBooleanCheckbox

for (var propertyName in PrimeFaces.widgets) {
  if (PrimeFaces.widgets[propertyName] instanceof PrimeFaces.widget.SelectBooleanCheckbox) {
    PrimeFaces.widgets[propertyName].check();// to check       
    PrimeFaces.widgets[propertyName].jq; //jQuery reference
  }
}

Now after this you can check the first occurring element, and build your array.

Answer 2

You can figure out the widgetVar assigned to the selectBooleanCheckbox. It's generally the combination of the following strings.

"widget_" + <form id> + "_form_" + <selectBooleanCheckbox id>

Note: In my case, the ids have dashes. Dashes are converted to underscores. For example, you have:

<h:form id='my-page'> and <p:selectBooleanCheckbox id='the-checkboxes'>

The widgetVar would be:

"widget_my_page_form_the_checkboxes"

I'd view your page source to verify. I believe the widgetVar string is formatted differently depending on what version of PrimeFaces you are using. I'm using PrimeFaces6.1.

Now get the object and give it a click like so...

P('widget_my_page_form_the_checkbox').click();