display multiple checkboxes values

[peacelake]

currently I optimizing my website and have a problem to display checkboxes values.

the case is:
I have a form to display items from a MySQL table and the items are splided in to 5 pages(total 20 items, and 4 items / page). I would like to add a checkbox behind the items, and if the end user checks items, then display the checkbox value below the form.
for example, the end user check 2 check boxes in page 1, display the values; and the end user continue to see page 3, and check 1 check box, the values(total checked 3 boxes) will be showed below the form.

How can I make it? I am a freshman, I have tried this many ways but can't make it works. I hope someone can help me out. thank you very much in advance.

[gits]

so ... just for my understanding ... basicly you have 3 pages and the user might select items on every page ... on the 3rd page you want to show a summary of the previous selections? is that correct?

kind regards

[peacelake]

Thank you for your reply.
it is an example that the end user submit the selection on the 3rd page. The end user may or may not continue the selection.

basicaly my idea is :
the end user selects checkboxes, show all the selections after he clicks the submit button.

Can you help?

[gits]

how do you go from page to page? is every form submitted during page-switching?

[peacelake]

no, one form includes one table and one submit button; the table <td>s contain all the items. The items are splited by MySQL "limit $row, $pageNumber". I have 4 files;

home.php;
formTable.php

<form id="form1">
<table>
<?
$select ="SELECT * from $table where available='YES' limit 3, 3";
	$result = mysql_query($select);
	
	if(!$result ){
		die('$result error: '.mysql_error());
	}
	
	while( $proItemRow = mysql_fetch_assoc($result)){
                 ....
		print '<tr><td><b>select</b>: <input type="checkbox" name="checkPro[]" value="'.$proItemRow['profile'].'" /></td>';
		
	}  
?>

</table>
<input type="submit" value="submit" onclick="javascript:get(this);"/>
echo paging($table,'*',3, $pageNumber);

paging.php

function paging($a,$b,$c,$d){
...
echo "<a href=\"$self?page=$page\">$page </font> </a>";
}

getInfo.js

function retrieveSelections( url){
		
		if( window.XMLHttpRequest){
			 xmlhttp= new XMLHttpRequest();
		}
		else{
		 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
		}
		var serverText = XMLHttpRequest.responseText;
		xmlhttp.open("GET",url,false);
		xmlhttp.send(null);
		document.getElementById('showhere').innerHTML=xmlhttp.responseText;
		
	}
function get(obj){
	var getstr = "";
		for (i=0; i<obj.length; i++) {
		
			   if (obj.checked) {
				  getstr += obj.name;
			   } 
			
		}
			
	retrieveSelections("formTable.php?'getstr'");		
		
}

so far it works without spliting the items into different page, but I can keep the check box check status. for example, if the end user checked the checkbox(es) and submit it, the values are showed but all the checkbox are unchecked.

How to handle it? did I construct it wrong?