Welcome, Guest: Join CodeXpress Log In!

Stats: 13 Members, 112 topics and 9 posts Date:  Wednesday 22 September 2021 at 06:23 PM

This is a product of CodeXpress Buy License for your website

[Go Make Things] How to clear all of the fields in a form with vanilla JS

CodeXpress / Science/Technology / Vanilla JS / [Go Make Things] How to clear all of the fields in a form with vanilla JS

91 people viewed

[go Make Things] Finding Remote Web Dev Jobs [go Make Things] Can Junior Developers Ask Too Many Questions? [go Make Things] Run A Function After A Specified Amount Of Time Using Vanilla Js [go Make Things] How To Clear All Of The Fields In A Form With Vanilla Js
(Go Down) (» Reply topic)
[Go Make Things] How to clear all of the fields in a form with vanilla JS by Marshallunduemi(): Wed 08, July, 2020
Once the form is successfully submitted, there’s a good chance you’ll want to clear all of the fields in the form.

Fortunately, vanilla JS has a handy little method for doing just that: HTMLFormElement.reset().


document.addEventListener('submit', function (event) {

// Prevent default form submit
event.preventDefault();

// Clear the form fields
// event.target is the thing that triggered the event, in this case, the form
event.target.reset();

});


The HTMLFormElement.reset() method resets all fields in a form back to their default values. This means that if you had a specified value property on a field, and the user changed it, it would revert to the original instead of emptying completely.

Here’s a demo.

The HTMLFormElement.reset() method works in all modern browsers, and IE9 and above.

You would like - how to disable a form when submitting it with Ajax or an API.

Welcome to CodeXpress Forum Script - Download NL script Free
(» Go Up)

You must Sign in or Sign Up to post content

For you to post content on this website you have to log in or register, it only take few minute to create account

Go Up

Recommended for you

[go Make Things] Run A Function After A Specified Amount Of Time Using Vanilla Js [go Make Things] Can Junior Developers Ask Too Many Questions? [go Make Things] Free Icons For Use In Your Projects [go Make Things] How To Clear All Of The Fields In A Form With Vanilla Js

Currently: 1 guest(s) reading this article

Developed by Codexpress Programming Labs
Post content
Powered by Marshall