Question

So I have my nifty function that detects changes for me in a form:

function EnableChangeDetection(eForm) {

    // One of the nice benefits of this change detection is that we don't have
    //  to keep an additional array of previous values to compare.  Also we
    //  don't have to worry about applying global unformatting for comparison
    //  and formatting back

    // For each input control
    $("#" + eForm + " :input")
    // Add a change event that will trigger if the form has been changed
        .one("change", function() {

            $.jGrowl("Change detected...");

            // Flag the form with an IsDirty class
            $("#" + eForm)
                .attr("class", "IsDirty")

            // Now remove the event handler from all the elements
            // since you don't need it any more.
            $("#" + eForm + " :input")
                .unbind("change");
        });
}

The problem is that this change functions fires inconsistently for non textbox inputs (checkboxs and radio buttons) in IE. Works fine everywhere else of course…

Answer 1

Here’s my workaround that’s been working…

function EnableChangeDetection(eForm) {

    // One of the nice benefits of this change detection is that we don't have
    //  to keep an additional array of previous values to compare.  Also we
    //  don't have to worry about applying global unformatting for comparison
    //  and formatting back

    // IE6 Workaround: onchange events need a blur event to properly fire
    $("#" + eForm + " :input[type='checkbox'], input[type='radio']")
        .one("click", function() { $(this).get(0).blur(); })

    // For each input control
    $("#" + eForm + " :input")
        // Add a change event that will trigger if the form has been changed
        .one("change", function() {

            $.jGrowl("Change detected...");

            // Flag the form with an IsDirty class
            $("#" + eForm)
                .attr("class", "IsDirty")

            // Now remove the event handler from all the elements
            //  since you don't need it any more.
            $("#" + eForm + " :input")
                .unbind("change");
        });
}