How to access a datatable row data when click on another datatable row?

gh2m

I have two datatables as follows:
var table1 = $('#texample1').DataTable({
select: true
});

var table2 = $('#example2').DataTable({
......
});

$('#example2').on('click', 'tr', function(){
var data = table1
.rows({selected: true})
.data()
.pluck(0)
.toArray();

console.log(data);

});

What I want to do is to click on a row in example1 table (will be 'selected' after the click) and then click a row on example2 table to see the row of example1 data.

Here is the behavior I got from above code:
1. click the first row of table1, I see array of all the first column of all the other rows that I do not click;
2. then click the second row of table1, I see array of all the first column of all the other rows except row 1 and row 2 I clicked;
3. and so on if I continue;
4. after I clicked all the rows in table1, I see an empty array;
5. I then click any one of rows I clicked (deselect, I can see class 'selected' is removed), the array is still empty;
6. No matter how many or rows I deselect, the array will be empty.

What did I do wrong?

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin