Listen for the click on the reset.
function protection_selected() {
var isVisible = $('#protection_switch').val() == '1';
$('#protection_data').toggle(isVisible);
}
$(function(){ //document ready
$("#protection_switch") //get your select element
.on("change", protection_selected) //listen for change event
.change(); //trigger the change event so defaults can be set
$('input:reset').on("click", function(e){ //bind click event to reset button
this.form.reset(); //force reset so we guarantee it has finished running
protection_selected(); //run the update code
e.preventDefault(); //cancel the click since we already ran the reset code
});
});
The pain in the rear thing about reset is you can detect when it has called, but there is no event for after it has successfully run. That is why I captured the click, run the reset on the form, called your function, and cancelled the click. Other way is to just use a delay inside and than call the function, but that can lead to a race condition.