Try our conversational search powered by Generative AI!

Resetting a form after submission

Vote:
 

We have a form that includes the results from some other settings made on the page that the user can then have sent to them via a form. When they do this we open a dialog with the form, they enter their details and send it and then we close the dialog. If they then keep using the page and make more changes and open the dialog again the "Form submitted" message is shown directly.

What I would like here is a javascript-way of resetting a form back to its initial state, is that possible?

#306867
Aug 16, 2023 7:27
Vote:
 

When you're opening your modal, you can reset it based on your requirements. Below are the js functions that I use in my forms when the modal pops up. 
So, when the modal popup you need to pass your input field in this function. It'll preset the form value when the form has already submitted

function (input) {
    var parentForm = input.closest('form');
    if (parentForm === null || !parentForm.classList.contains('EPiServerForms')) {
        input.value = '';
    }
    else {
        var formMainBody = parentForm.querySelector(".Form__MainBody");
        if (formMainBody && formMainBody.style.display === "none") {
            formMainBody.removeAttribute("style");
            var formStatusMessage = parentForm.querySelector(".Form__Status__Message");
            if (formStatusMessage) {
                formStatusMessage.innerHTML = ''
                formStatusMessage.classList.remove("Form__Success__Message", "Form__Warning__Message");
                formStatusMessage.classList.add("hide");
            }
            parentForm.reset();
        }
    }
}
#308188
Sep 08, 2023 7:37
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.