How to reset Form values back to original values depending on which button is clicked?

Question

I have a single form which sends emails to people. There are two buttons to do this: New and Reply.

• Pressing New: If you want to compose a new e-mail then the page should use the default input element values already set in the Form. This includes default attributes of those input elements.
• Pressing Reply: If you want to reply to an existing email, then JQuery modifies the values of the subject field and recipient field before submission. It also modifies some hidden field values and adds the attribute of readonly to the subject field.

However if someone clicks on Reply and then changes their mind to actually send a New email, I have lost all the default values and attributes for the Form. I can't enter these values in manually because the values come from a database dynamically.

I can't get my head around how to switch between New and Reply on the page. I guess I could reload the page when someone clicks New but is that the only way?

EDIT: I should have mentioned I need to reset the values of Hidden fields as well. When I say "reset" I actually mean go back to their original values.... not clear the value attribute.

Answer 1

That's exactly what the reset method does.

$("#myform")[0].reset();

https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement.reset

You can also get the default value of an input by getting its value attribute or its default value property (assuming you haven't manually changed them, but you should never do that.)

var val = $("#theinput").attr("value");

and

var val = $("#theinput").prop("defaultValue");