I am using the datatables.net jQuery plugin with an <apex:datatable /> and I want to submit all records from the javascript array[], meaning i'm using

<apex:stylesheet value="{!$Resource.lib}/css/jquery.dataTables.css"> 
<apex:includeScript value="{!$Resource.lib}/js/jquery.dataTables.min.js"/> 

Here is the Code to initialize dataTable Jquery:

 jQuery(document).ready(function(){
    $('table[id$="itemsList"]').dataTable();
                    
    // Check / uncheck all available rows at once.
        jQuery('#selectAll').click( function(){             
            if(jQuery(this).is(':checked')){
                jQuery('.chkProd').attr('checked', true);               
            }else{
                jQuery('.chkProd').attr('checked', false);
            }
           });
 });

in my VisualForce Page. And i have the follow environment, which has "10","50","100" options records to display:

<apex:dataTable value="{!listaInnerProduct}" var="item" id="itemsList" rowClasses="odd,even" rendered="{!IF(tempListaInnerProd.size == 0,true,false)}">
           <apex:column >  
             <apex:facet name="header">
                <input type="checkbox" id="selectAll" value="" title="Selecccionar todos los registros." />
             </apex:facet>   
             <apex:inputCheckbox styleClass="chkProd" value="{!item.isSelected}" />  
           </apex:column>              
           <apex:column >  
             <apex:facet name="header">Cantidad</apex:facet> 
             <apex:inputText value="{!item.cantidad}" style="width:30px;" onkeypress="return isNumberKey(event)"></apex:inputText>
           </apex:column>         
</apex:dataTable>

Controller Code:

public with sharing class AgregarProductosController {

 public List<InnerProduct> listaInnerProduct {get;set;}

 public AgregarProductosController(ApexPages.standardController stdCon){
  this.listaInnerProduct = obtenerProductosInternos();
 }

public List<InnerProduct> obtenerProductosInternos(){
 List<InnerProduct> listaInnerProduct = new List<InnerProduct>();
 InnerProduct inProd;
 for(Product2 prod : [Select Id,Name From Product2]){

  //code to create new Wrapp object for each product2

 }
}

public class InnerProduct{
    public Id productId {get;set;}
    public String name {get;set;}
    public Boolean isSelected {get;set;}
}

listaInnerProduct is a list of Wrapper Class which has a boolean attr isSelected.

When i toggle between the pages "next page" and check others records in the table only submit the records that were checked in the last page records displayed. I mean, the table shows up 10 records you checked 4 and do click in next page, other 10 records will be displayed and then check 2 more and Submit. Only the last two records are "selected" in the wrapp Class.

I want to submit all javascript List so i could save all the selected records. Any idea to handle this?