jQuery how to undo a select change

Rather than using a global variable (evil!) or a hidden element (abuse of the DOM) you can use the $.data feature:

$('select').change(function() {
    var selected = $(this).val();

    if (selected == 'bar') {
        if (!confirm('Are you sure?')) {
            $(this).val($.data(this, 'current'));
            return false;
        }     
    }

    $.data(this, 'current', $(this).val());
});

Hope this would help.

$( YOUR_SELECT_ELEMENT ).on({
    "ready": function (e) {
        $(this).attr("readonly",true);
    },
    "focus": function (e) {
        $(this).data( { choice: $(this).val() } );
    },
    "change": function (e) {
        if ( ! confirm( "Change selected option, proceed?" ) ){
            $(this).val( $(this).data('choice') );
            return false;
        } else {
            $(this).attr("readonly",false);
            return true;
        }
    }
});

I'm not sure 'return false' is effective for remove the attribute 'readonly'.

Tags:

Jquery