How can I pass the value coming from a jQuery variable to PHP?

Question

The webpage I am working on has many rows of data with checkboxes at the end.

Sample is:

So I am collecting the Page IDs of each row when the user checks the checkbox.

But how do I pass the collected data from jQuery to PHP?

So far I have the following:

jQuery:

var collectionOfPages = [];

(function ( $ ){
    $.fn.addCheckBox = function()
    {
        $("#submitAddID").on("click", this, function()
        {
               alert(collectionOfPages);
        });

        $("#addCheckBoxes input[type='checkbox']").click(function() 
        {      
            if($(this).prop('checked') == true) 
            {
                 $('#addCheckBoxes :checked').each(function() 
                 {
                    collectionOfPages.push($(this).val());
                 }); 
            } 
            else
            {                              
               //TODO
            }   
        });
    };   
})(jQuery);

PHP:

<form name="frmAdd" id="addCheckboxForm" method="post" action="index.php">
    <input type="hidden" name="useridHidden" id="useridHidden"/>
    <input type="hidden" name="pagesHidden"  id="pagesHidden" />
</form>

<table id="checkboxTables" cellpadding="10" cellspacing="1">
    <thead>
            <tr>
                <th><strong>Page ID</strong></th>
                <th><strong>Page Name</strong></th>
                <th><strong>Action</strong></th>
            </tr>
    </thead>

     <tbody>
             <tr id="addCheckBoxes">
                 <td><?php echo $row["PAGEID"]; ?></td>
                 <td><?php echo $row["PAGENAME"]; ?></td>
                 <td><input type="checkbox" name="chkboxAdd" $row["PAGEID"]; ?>">Add</td>
             </tr>
     </tbody>

</table>

<button type="button" name="submitAdd" id="submitAddID">Submit </button>

So I would like to pass the values coming from the jQuery variable

collectionOfPages

to the PHP variable:

$_POST['pagesHidden]

which was created inside the

<input type="hidden" name="pagesHidden"  id="pagesHidden" />

Thank you in advance.

Answer 1

You can use jQuery.ajax

$("#submitAddID").on("click", this, function() {
     $.ajax({
         method: "POST",
         url: "some.php",
         data: { 'collectionOfPages': collectionOfPages }
     });
});