Need to get the row count on click of the selectRowIndividualCheckbox in the async table

, ,
1

Hi All,

Below are the things i have in my CAF portlet.

1.Async table with selectRowIndividualCheckbox to select the rows from the table.

  1. Custom script control with a onclick event.

i suppose to invoke the javascript exists in the custom script controll, when i click selectRowIndividualCheckbox controll exists in the async table.

I am not able to invoke the javascript which exists in the custom script. Could be any reason for that?Below is the javascript i had written in the custom script.

var rowCount=CAF.model(“#{activePageBean.clientIds[‘asyncTable’]}”).getRowSelectedCount();
alert(rowCount);

FYI,

I have used the same for the async command button for a client-side events(click).

i did not understand why i am not able to get the row count when i click on the selectRowIndividualCheckbox with the help of the above javascript.

please help me out.

Thanks in advance

2

I suspect part of their problem is a side effect of how the clientids are calculated while the table is rendering the rows of a table. For example, while a table row is being rendered, the #{activePageBean.clientIds[‘asyncTable’]} expression resolves to the clientId of the current row instead of the clientId of the table itself. My recommendation is that whenever you have a script that need to interact with the table model, it is best to do that with a script control that is not nested inside the table control.

Alternatively, you can evaluate the element that was clicked and use DOM traversal to walk up to the table element and get the CAF model for that table.

For example:


//given the item that was clicked, traverse up the DOM to the containing table tag
var table = $(this).up("table");
var rowCount=CAF.model(table).getRowSelectedCount();
alert(rowCount);

Reference:

3

Hi Eric,

Thanks for your reply,

i tried the above mentioned solution in the script, but not helped me to get the row count.

var table = $(‘jsfwmp8672:defaultForm1:asyncTable__selection’).up(‘table’);

till this line the script is executing fine, and when alert this table value , it has returned as undefined.

but the below script is executing.

var rowCount=CAF.model(table).getRowSelectedCount();
alert(rowCount);

Do we have any other way to get this done? i have used the belwo script as well for to get the row count in a custom script for an onclick event, but not helped.

CAF.model(“#{activePageBean.clientIds[‘asyncTable’]}”.addRowChangeListener(function(tableId,rowId,eventType) {
if (eventType == “select”) {
alert('Row Selection Changed for Row: ');

				}  
			});

Thanks

4

Please double check that you are using an element id that exists in your page.

The sample provided works fine for me.

5

Hi Eric,

Please find the attachment for the screen shot.

Thanks

Image.jpg
Image.jpg1527×648 203 KB

6

I see. Well it looks like you were trying this;

 var table = $('jsfwmp8672:defaultForm1:asyncTable__selection').up('table');

And as your screenshot shows, the element with the id of ‘jsfwmp8672:defaultForm1:asyncTable__selection’ is not a child of the

tag, so it is correct that the element.up(‘table’) call returned null as there is no table ancestor for that id.

If the example I provided, I resolved the table from the “this” variable which should be the element that was clicked on, but yours is different by using a hardcoded id string.

var table = $(this).up("table");