Disable HTML form element with reset button

Question

I wonder whether it is possible to disable a form element or a set of form elements with the 'reset' button. In detail: I have a form with checkboxes and associated dropdown lists ('select' elements with size=1). When I check one of the checkboxes, the correspondent dropdown is enabled. When I uncheck the box, the correspondent dropdown is disabled.

But when I click the reset button, all checkboxes are unchecked automatically while the correspondent dropdowns still remain enabled. Is there another option to disable them beside of writing an own function which would iterate on the dropdowns disabling each of them and assigning this function to the 'onreset' event of my form?

Kind regards
Ewgenij

Answer 1

you mean something like this?:

$('#reset').click(function(){
       $("#target input").prop("disabled", true);
});

Well, to disable a form without unchecking it the function works. See here

But maybe I understood wrong. In that case some code of the author would be useful.

Answer 2

You just need to run a JavaScript function after the form resets. That is, track the state of the elements in hidden fields, and use those values to either disable or enable after the reset.

The code for disable is simple enough.

document.getElementById("[form element ID]".disable = true;