How to reset form input element on click

You can reset the form input element on click using jQuery by assigning null value to it. Here we can use jquery / javascript element selector and after that assign null value using .val() method in jQuery and .value method in javascript.

Answers 2
  • Reset form input element by name on click using jQuery

    <form id="formId" method="POST" action="../">
        <input type="text" name="first_name" value="w3codegenerator.com" />
    </form>
    <button type="button"> Click button </button>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
    $(document).ready(function(){
        $('button').on('click', function(){
            $('#formId').find('input[name="first_name"]').val('');
        });
    })
    </script>
    
    0
  • Reset form on click button using reset() method in jQuery

    <form id="FormId">
        <input type="text" name="name" />
    </form>
    <button type="button"> Reset Form </button>
    
    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script>
    $(document).ready(function() {
        $("button").click(function() {
            $("#FormId")[0].reset()
        });
    });
    </script>
    
    0
  • Back to code snippet queries related jquery