jQuery how to undo a select change

Question

I have a select box, and I'd like to add a confirm before changing it to a specific option. Example:

<select name="select">     <option value="foo" selected="selected">foo</option>     <option value="bar">bar</option> </select>​​​​​​​​​​​​​​​​​​

$('select').change(function() {     var selected = $(this).val();      if (selected == 'bar') {         if (!confirm('Are you sure?')) {             // set back to previously selected option         }     } });

I'm thinking about adding a hidden input field and update its value every time the select is changed. That way I can retrieve the previous value in the change function. Example:

<input type="hidden" name="current" value="foo" />

$('select').change(function() {     var selected = $(this).val();     var current = $('input[name=current]').val();      if (selected == 'bar') {         if (!confirm('Are you sure?')) {             $(this).val(current);             return false;         }     }      $('input[name=current]').val(selected); });

Is there an easier/better way to accomplish this?

Answer 1

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()); }); 

Answer 2

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'.