<script type="text/javascript">
//Wait for the document to be ready
$(document).ready(function(){
//Listen for a click on every checkbox
$("input:checkbox").click(function () {
var val = $(this).val();
var name = $(this).attr('name');
//This is so IE does not cache the results
var noCache = new Date();
//Make a JSON request
$.getJSON('ajax.php', {'item':name, 'val':val, '_':noCache.getTime()}, function(json){
$("[name='" + json.item + "']").attr('value', json.check )
});
});
});
</script>
Well let me go through it and try to explain it better.
in jQuery the $.(document).ready() function is setup immediately following initialization of the DOM.
So the code sits in there so it can be used even before the actual content on the page is loaded.
The main workhorse is this function:
//Listen for a click on every checkbox
$("input:checkbox").click(function () {
var val = $(this).val();
var name = $(this).attr('name');
//This is so IE does not cache the results
var noCache = new Date();
//Make a JSON request
$.getJSON('ajax.php', {'item':name, 'val':val, '_':noCache.getTime()}, function(json){
$("[name='" + json.item + "']").attr('value', json.check )
});
what this does is says listen for a click event on every input type of checkbox. On a click of any checkbox its runs the function contained in that code.
it gets the value of the checkbox that was just checked $.(this).val();
and also grabs the name of the field.
In my exampe I made the name unique for each checkbox and then set a default value of 0 indicating it was not display.
the noCache is just a date object so that IE does not cache the GET request.
$.getJSON() setups the ajax request for ajax.php. {'item':name, ... } is the query parameters.
This function ultimately requests: ajax.php?item=fieldname&val=checkboxvalue&_{timestamp}
ajax.php in my example simply is looking for a get variable and then encoding a basic php array into JSON and then echoing the JSON to the stream.
$.getJSON returns a JSON object by default so we can simply navigate it with jQuery.
the last attribute is the function to call on a successful ajax request. In this case i specified it right in the $.getJSON function.
it just looks for an element with the name id of the one submitted and then updates its value according to the JSON response. in this case changes 0 to 1 or 1 to 0.
Thats all there is too it, like i said its not the perfect response to your problem but it does do everything you wanted. Depending on your php version etc we can also work without the JSON.
Use php to initially draw the form, and you dont need to inject any javascript into the elements themselves. This makes for much cleaner code.
Hopefully this helps break it down some more.
I apologize because i left an early function (updateElement) in my previous example and its not needed.
Please feel free to ask any more specific questions and I'll try to help you get started with jQuery which if you're relying on ajax and/or javascript will dramatically improve your time, i know it did for me.
Unsolved 
