Sorry for the mess I produced. Of course all this stuff with _checked array is not necessery if you want send AjaxRequest immediatly after checkbox click - just extract the clicked item and send all needed data including checkbox state as you do.



I wrote a routine (not sure if it fits exactly what you need), yet it presents the logic and maybe you will be able to fit in your code. Notice it is not tested and uses prototype 1.7. It is wrote as clousure yet you may transfer it easly into Object Literal or class or something. Ah - and there is only one observer - on form:

Here you are:

    var _checked = undefined;

    document.observe("dom:loaded", function()
        // select all checked ckeckboxes
        _checked = $('formId').select('input[checked]').pluck('value');

    //register observer on form click
        $('formId').on('click', _onClick);

    function _onClick(event, element)
        var isUnchecked = undefined;

        //if clicked element is input
        if (element.tagName.toLowerCase() == 'input') {

// here we find out if our checkbox was checked or not at time of page loaded (isUnchecked == true shows it was checked and now is not) isUnchecked = _checked.indexOf(element.value) > -1 ? true : false;

            // send Ajax request
            _sendAjaxRequest(element, isUnchecked);

    function _sendAjaxRequest(element, isUnchecked)

        new Ajax.Request('url', {
            method: 'post',
parameters: { here you serialize your checkbox (element) manually},

            onSuccess: function(transport) {
                var response = transport.responseText.evalJSON();

            onComplete: function() {

Hope it helps


I just drastically shortened this down...
I'm now serializing the data manually with: strSerialize = "active_record=" +cbValue +"&state=" +strState;
Which produces: active_record=5&state="checked"
On the server side I can easily get the two values with $_POST... so far perfect...
I've deleted all the hidden fields...
Now when you click on the checkbox, onchange does all the work and since I enable/disable the form, only one submission happens at a time... exactly as we want it... Working perfectly...
Thanks for the help!
On Thu, Apr 26, 2012 at 10:51 AM, Phil Petree < <>> wrote:

    I got it working... here's where I am so far:
    1) at the top of the form I created a hidden input called
    'active_record' which holds the $('id') of the row in progress
    2) each row has <input type=hidden name=$record_num value=''>
    <input type=checkbox value=$record_num
    checked='checked/unchecked' onchange='updateRow(
    <>, this.value);' >
    3) updateRow(cbID, cbValue) {} wherein I set the value of the
    hidden $record_num with "checked" || "unchecked" and
    active_record with the cbValue and then call my ajax function
    which serializes the form and makes the call.
    4) oncomplete: I clear the two hidden inputs.
    In my php code I can check my $_POST:
    $record = $_POST['active_record'];
    $value = $_POST[$record];
    error_log("record num is: $record and is set to $value");
    I'm still sending all the rows where the type=checkbox has
    checked=checked but I'm not processing those. Has no real impact
    on performance right now but with 1000's of users and frequent
    approval/disapprovals, it will unnecesssarily suck up bandwidth
    and time.
    Any idea how to serialize just one field? Afterall, all I really
    need to do is send the checked/unchecked from the active_records
    hidden input...

You received this message because you are subscribed to the Google Groups "Prototype 
&" group.
To post to this group, send email to
To unsubscribe from this group, send email to
For more options, visit this group at

Reply via email to